iCheckとVue.jsに翻弄された件について
iCheckとVue.jsを使用して、
チェックボックスのリストを動的に表示していたら困った話とその解決策について少しだけ。
やりたいのは↑みたいな感じのリストを動的に出したい(画像が大きすぎるな(ー_ー;)
HTMLはこんな感じ
index.html
<ul v-for="hoge in hoges">
<li>
<input type="checkbox" name="checkbox" v-bind:value="hoge" v-model="checkedNames">
</li>
</ul>
まず初めにやったこと
script.coffee
# init内に設定を記載
init: ->
$('.checkbox').iCheck
checkboxClass: 'icheckbox_minimal-red'
これだと初回表示時は上手く行きますが、
ページング等を挟むと上手くiCheckが反映されません(・・;)
対応策
script.coffee
# watchに書く
watch:
'checkedNames': ->
$('.checkbox').iCheck
checkboxClass: 'icheckbox_minimal-red'
これで問題なく反映されました
そもそもこの2つの組み合わせはNGみたいなことはあまり考慮していないので、
問題等もあるかと思いますが、ご容赦下さいm(_ _)m
Author And Source
この問題について(iCheckとVue.jsに翻弄された件について), 我々は、より多くの情報をここで見つけました https://qiita.com/TekkaMK/items/d4fe3f447f6223ab3a41著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .