其他分享
首页 > 其他分享> > VUE学习日记(十一) ---- 数据绑定v-model(表单:复选框)

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>

效果图:

 

 

 

标签:el,VUE,myPage,复选框,----,model,表单,checkedGames
来源: https://www.cnblogs.com/JoeYD/p/13554134.html