Reactガイドを読んでいくその57

これは

Reactのガイドを読んでいく記事です。

ガイドのリンク

ja.reactjs.org

JSX における props

文字列リテラル

ここでの説明はそれほど重要ではないが、包括的な解説の一環として記載されている。

文字列リテラルをpropsとして渡すことができるため、
以下に示す二つは全く等しいものになる。

<HogeComponent info="React Hello" />
<HogeComponent info={'React Hello'} />

文字列リテラルを渡す際には値のHTMLエスケープは元の形に復元される。
以下に示す二つも全く等しいものになる。

<MyComponent message="&lt;3" />
<MyComponent message={'<3'} />

プロパティのデフォルト値は true

プロパティはtrueをデフォルトにしている。
例えば以下の二つは全く等しいものになる。
<FooTextBox autocomplete /> <FooTextBox autocomplete={true} />

特別な理由がない場合、値を省略するようなことはしないほうが良いが、
ES6のオブジェクト簡略表記いおいて{foo}は'{foo: true}'ではなく`{foo: foo}'になるので、
HTMLに似せて作った場合混乱をきたす可能性がある。

今日はここまで。