riot.js(v3) 要素の表示・非表示をhidden属性で行う
riot.jsでは show, hideディレクティブを使用することで、「要素は生成するが、条件によって表示・非表示する」ことができます。
条件属性 | riot.js
これは要素のスタイルにdisplay: none;
(+ hidden属性)を付け外しすることで実現されているのですが、style属性を勝手に触られると気持ち悪いので、私はhidden属性を利用するようにしています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<style> /* 適当なCSSに記載 */ [hidden]{ display: none !important; } </style> /* タグ */ <my-tag> <div> <div hidden="{isHide}">非表示になる</div> </div> <script> this.isHide = true; </script> </my-tag> |