VUE学习日记（十一） ---- 数据绑定v-model（表单：复选框）

 

<div id="myPage">
      <h2>表单复选框</h2>
      <input type="checkbox" id="水浒Q传" value="水浒Q传" v-model="checkedGames">
      <label for="水浒Q传">水浒Q传</label>
      <input type="checkbox" id="元气骑士" value="元气骑士" v-model="checkedGames">
      <label for="元气骑士">元气骑士</label>
      <input type="checkbox" id="战魂铭人" value="战魂铭人" v-model="checkedGames">
      <label for="战魂铭人">战魂铭人</label>
      <br>
      <p>你选择的游戏有：{{checkedGames}}<p>

    </div>    

    <script>
      var myPage = new Vue({
        el:'#myPage',
        data:{
          checkedGames:[]
        }
      })
    </script>

效果图：