コンポーネントに受け渡す値の変数名に「title」は使わない

コンポーネントに分割していくときに、例えば何かのリストを表示する場合に要素を渡すということが発生するが、 変数名にあたる属性部分に「title」を使いたくなる場面がある。

// hoge-list
<hoge-list>
  <hoge title="ほげタイトル1" text="ほげほげほげ" />
  <hoge title="ほげタイトル2" text="ほげほげほげ" />
  <hoge title="ほげタイトル3" text="ほげほげほげ" />
</hoge-list>


// hoge
<hoge>
    <h1>{opts.title}</h1>
    <div>{opts.text}</div>
</hoge>

これだと、titleグローバル属性と重複するので、 要素にマウスをフォーカスすると、ツールチップが表示されてしまいます。

なので、「title」という属性は使わないようにする。 この場合だと「hoge-title」とかかな。