Vue实现选课功能（自动）
选中课程，课程直接显示在已选课程框里，无需点击选课按钮。
要点：利用v-model实现与选中值的绑定。代码如下：
<body>
<div id="app" >
<div id="course" >
<input type="checkbox" name="1" v-model="checks" value="马克思主义哲学" >马克思主义哲学
<input type="checkbox" name="2" v-model="checks" value="计算机网络">计算机网络
<input type="checkbox" name="3" v-model="checks" value="数据结构">数据结构
<input type="checkbox" name="4" v-model="checks" value="c语言工程">c语言工程
<input type="checkbox" name="5" v-model="checks" value="大数据时代">大数据时代
<input type="checkbox" name="6" v-model="checks" value="大学英语">大学英语
</div>
<div id="choose">
选课
</div>
<div id="result" >
<!-- {
{显示checks}} -->
{
{checks}}<br>
</div>
</div>
<script>
var VueApp = new Vue({
el: #app,
data: {
checks:[],//当选中复选框时，其value值会自动填充进数组；取消选中时，值也会从数组中自动移除。
},
methods: {
}
});
</script>
</body>
效果如下：
上一篇：
IDEA上Java项目控制台中文乱码