🐕🦺
Material-uiでボタンを動的にdisabledにする
通常のdisable
<Button disabled onClick={deleteSomething}>削除</Button>
これで灰色で押せないボタンとなる。
だが、例えばログイン済みでないと押せないボタンなど、動的にdisableかそうでないか決めたい時がある。
動的にdisabled
<Button disabled={!isAuthenticated} onClick={deleteSomething}>削除</Button>
isAuthenticatedはサインインしているかどうかのbooleanが入る。
これでisAuthenticatedがfalseの時、disableとなり押せないボタンとなる。
またこれは以下のように比較式を入れることもできる。
<Button disabled={checkList.length==0} onClick={deleteSomething}>削除</Button>
上記はチェックしたものの個数(checkList.length)が0だと押せないボタンの例。
公式にはなかったため見返すようにまとめました。
お読みいただきありがとうございます。
Discussion