vue中checkbox组的使用
<html><head><script src='js/vue.js'></script></head><body><div id="example"><input ty
·
<html>
<head>
<script src='js/vue.js'></script>
</head>
<body>
<div id="example">
<input type='checkbox' id='china' value='china' v-model='countries'/>
<label for='china'>china</label>
<input type='checkbox' id='japan' value='japan' v-model='countries'/>
<label for='japan'>japan</label>
<input type='checkbox' id='english' value='english' v-model='countries'/>
<label for='english'>english</label><br>
<input type='button' v-on:click="show"/>显示<br>
<ul v-if='flag'>
<li v-for="country in countries">{{country}}</li>
</ul>
</div>
</body>
<script type='text/javascript'>
new Vue({
el: '#example',
data: {
flag: true,
countries: []
},
methods: {
show: function() {
this.flag = !this.flag;
}
},
computed: {
},
created() {
}
});
</script>
</html>
<head>
<script src='js/vue.js'></script>
</head>
<body>
<div id="example">
<input type='checkbox' id='china' value='china' v-model='countries'/>
<label for='china'>china</label>
<input type='checkbox' id='japan' value='japan' v-model='countries'/>
<label for='japan'>japan</label>
<input type='checkbox' id='english' value='english' v-model='countries'/>
<label for='english'>english</label><br>
<input type='button' v-on:click="show"/>显示<br>
<ul v-if='flag'>
<li v-for="country in countries">{{country}}</li>
</ul>
</div>
</body>
<script type='text/javascript'>
new Vue({
el: '#example',
data: {
flag: true,
countries: []
},
methods: {
show: function() {
this.flag = !this.flag;
}
},
computed: {
},
created() {
}
});
</script>
</html>
更多推荐
已为社区贡献7条内容
所有评论(0)