JSXを使用してチェックボックスのデフォルト状態を正しく設定する方法

Question

HTML5が、チェックボックスのチェックを外していると確実に解釈される "checked"属性の値がないと指定した場合、ブラウザ間で以下のJSXコードの動作が矛盾する可能性がありますか？ （それはChromeとIEで私のために期待どおりに動作するようです。）

<input type="checkbox" checked={node.props.checked} /> 

その場合は、以下のJSXが無効であることを考慮すると、これを実現するための標準的な方法は何ですか？

<input type="checkbox" {node.props.checked? "checked" : ""} /> 

What values for checked and selected are false?

Answer 1

あなたは条件付きで全体checked属性ではなく、属性の値だけを追加する必要があります。そうすれば、属性をまったく追加しないと、チェックされていないチェックボックスが確実に表示されます。

あなたは、this answerによると、ReactJSを使用している場合：

あなたがそれに渡す 値がtruthyない場合は属性を省略するのに十分なインテリジェントで反応します。