- 820 名前：デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:07:11.66 ID:oNzvowiX0.net]
- [jQuery] 3行
$('.my-component [name="switch"]').change(function() {
$(this).closest('.my-component').toggleClass('active', this.checked);
});
[Vue] 12行
Vue.component('my-component',{
template:`
<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">{{val}}
</div>
`,
data:function(){return{
isActive:false
}},
props:["val"]
})
new Vue({el: '#app'})
あ、デザイナーさん。HTMLはVueのコードに移動したんで
デザイン変えたきゃVueの方いじってくださいねｗｗｗ
やっぱりこうなるｗ
行数は増え、分業ができなくなる
|
 |
