值绑定就是利用数据动态渲染出结构,数据改变,结构也改变
在label上用v-for取到colors中的每个元素item,
label for的值和input id的值都为item,点击label区域,就会跳转到input区域
在input上用v-bind动态绑定value值
mastach语法显示item
<div id="app">
<label v-for="item in colors" for="item">
<input type="checkbox" id="item" :value="item"/>{{item}}
</label>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
const app = new Vue({
el: '#app',
data: {
colors:['红','黄','蓝','绿']
}
})
</script>
网友评论