vue中如何判断radio是否选中

您所在的位置:网站首页 qt的radio怎么判断他选中 vue中如何判断radio是否选中

vue中如何判断radio是否选中

2023-08-05 18:13| 来源: 网络整理| 查看: 265

vue中判断radio是否选中的方法:1、设置v-model方法进行判断;2、给vue定义一个radio数组list,在list中每项设置一个isCheck标识进行判断即可。

vue中如何判断radio是否选中

方法1:

设置v-model方法进行判断,代码示例如下。

  

  

  

      

    test  

      

  

  

    

      

      获取选中的值

    

var vm = new Vue({

  el:'#app', 

  data(){

    return{

      checkedValue:'',

      list:[{value:1},{value:2},{value:3}]

    }

  },

  methods:{

    test(){

      console.log('被选中的值为:'+this.checkedValue)

    }

  }

});

  

方法2:

如果不想每次点击都判断,那就提供一个思路,定义一个radio数组list,每项设置一个isCheck标识,循环该数组渲染radio,点击按钮时再统一去判断

  

  

  

      

    test  

      

  

  

    

      

      获取选中的值

    

var vm = new Vue({

  el:'#app', 

  data(){

    return{

      list:[{value:1,isCheck:false},{value:2,isCheck:false},{value:3,isCheck:false}]

    }

  },

  methods:{

    changeInput(index){

      this.list.map((v,i)=>{ 

        if(i==index){

          v.isCheck = true

        }else{

          v.isCheck = false

        }

      })

    },

    test(){

      this.list.map((v,i)=>{

        if(v.isCheck){

          console.log('被选中的值为:'+v.value)

        }

      })

    }

  }

});

  



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3