表单复选框

知识点

  • v-model
  • input[type=”checkbox”]

表单复选框绑定

  1. <div id="myApp">
  2. <h1>表单复选框</h1>
  3. <input type="checkbox" id="生化危机7" value="生化危机7" v-model="checkedGames">
  4. <label for="生化危机7">生化危机7</label>
  5. <input type="checkbox" id="模拟飞行" value="模拟飞行" v-model="checkedGames">
  6. <label for="模拟飞行">模拟飞行</label>
  7. <input type="checkbox" id="塞尔达传说" value="塞尔达传说" v-model="checkedGames">
  8. <label for="塞尔达传说">塞尔达传说</label>
  9. <br>
  10. <p>您选择的游戏是: {{ checkedGames }}</p>
  11. </div>
  12. <script>
  13. var myApp = new Vue({
  14. el: '#myApp',
  15. data: {
  16. checkedGames: []
  17. },
  18. methods: {
  19. },
  20. });
  21. </script>