【React】checkboxをはじめからchecked状態にしようとした時の不具合対策

JavaScript で checkbox をはじめからチェックした状態にする場合は下記のように記述になります

<form>
  <input type="checkbox" checked="checked" />
</form>

しかし、React で同様な記述だとcheckbox をクリックしても、
チェックした状態のまま切り替わりません

<form>
  <input type='checkbox' defaultChecked='checked' />
</form>

checked="checked"の部分を上記のようにdefaultChecked='checked'にすると、
はじめはチェックした状態ですが、checkbox をクリックで正常に切り替わります

defaultChecked は default の後の Checked の 頭文字C は大文字

defaultChecked={false}にすると、はじめはチェックなしになる

最後まで読んでくださりありがとうございました。シェア頂けると嬉しいです!
  • URLをコピーしました!
  • URLをコピーしました!

ABOUT ME

WEB制作者
スキル:HTML・Sass(FLOCSS)・JavaScript・jQuery・WordPress

コメント

コメントする

CAPTCHA

目次