vue+vant组件Radio使用

1.开发环境 vue+vant
2.电脑系统 windows10专业版
3.在开发的过程中,我们经常会使用到vant中的Radio组件,下面我来简单的分享一下使用方法,希望对你有所帮助.
4.废话不多说,直接上代码:

如果你使用的是按需导入的模式,在main.js中添加如下代码
import { Switch,Button,Radio,RadioGroup,Cell, CellGroup } from 'vant';
Vue.use(Switch);
Vue.use(Button);
Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(Cell);
Vue.use(CellGroup);

5.在template中添加如下代码:


      
        
          
        
        
          
        
      
    

6.在return中添加如下代码:

radio: '1',

7.在methods中添加如下代码:

chenradio1() {
this.radio = "1";
console.log("我触发了点击事件一");
},
chenradio2() {
this.radio = "2";
console.log("我触发了点击事件2");
}

8.效果图如下:

9.当然也可以使用官方的写法,只是个人习惯这个写,根据自己的需求进行调整.
10.本期的分享到了这里就结束啦,是不是很nice,希望对你有所帮助,让我们一起努力走向巅峰.

你可能感兴趣的:(vue.js,vant)