• 在vue中使用checkbox


    在vue项目中如何使用多选框?结合前段时间工作中的需求写了这个笔记。

    在template里面写入<input>标签并指定类型type为checkbox,:value用来绑定当前项的value,v-model绑定一个数组,一旦当前项被选中,该项的value会被添加至被绑定的数组中。

    <input type="checkbox" name="checkBoxTest" :value='0' v-model="place" />北京
    <input type="checkbox" name="checkBoxTest" :value='1' v-model="place" />上海
    <input type="checkbox" name="checkBoxTest" :value='2' v-model="place" />广州
    <input type="checkbox" name="checkBoxTest" :value='3' v-model="place" />深圳
        
    <div>{{place}}</div>
    
    export default {
      name: 'App',
      components: {
      },
      data(){
        return{
          place:[]
        }
      }
    }
    

    place为绑定的数组,具体效果如下图所示

     

     

     
     
  • 相关阅读:
    Android
    Android
    Android
    JAVA动态代理基础
    TCP连接与OKHTTP复用连接池
    Android
    Android
    GitHub上README.md教程
    android
    HDU 1097 A hard puzzle
  • 原文地址:https://www.cnblogs.com/auschwitzer/p/15769234.html
Copyright © 2020-2023  润新知