elementUi vue el-radio 监听选中变化的实例代码


Posted in Javascript onJune 28, 2019

elementUi vue el-radio 监听选中变化的实例代码如下所述:

//change是radio-group标签的事件
<div>
 <el-radio-group v-model="radioSex" @change="changeHandler">
  <el-radio class="radio" label="man">男</el-radio>
  <el-radio class="radio" label="woman">女</el-radio> 
 </el-radio-group>
</div>
export default {
  name: 'Radio',
  data () {
   return {
    radioSex: 'man'
   }
  },
  methods: {
    changeHandler(value) {
      console.log('改变之后的值是:' + value)
    }
  }
 }

ps:下面给大家介绍下vue+elementui下监听屏幕变化并处理对应样式

mounted () {
window.addEventListener('resize', () => {
if (document.body.clientWidth < 900) {
this.tabposition = 'top'
} else {
this.tabposition = 'left'
}
})
}

补充:最好是将监听后对应的操作函数封装起来,然后再页面的销毁程序中对window解除对应监听。

总结

以上所述是小编给大家介绍的elementUi vue el-radio 监听选中变化,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
Javascript实现简单二级下拉菜单实例
Jun 15 Javascript
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
Oct 17 Javascript
jQuery+PHP+MySQL二级联动下拉菜单实例讲解
Oct 27 Javascript
AngularJS基础 ng-switch 指令简单示例
Aug 03 Javascript
原生js实现电商侧边导航效果
Jan 19 Javascript
js事件冒泡与事件捕获详解
Feb 20 Javascript
JS实现简单的天数计算器完整实例
Apr 28 Javascript
微信小程序之网络请求简单封装实例详解
Jun 28 Javascript
jQuery UI实现动画效果代码分享
Aug 19 jQuery
浅析我对JS延迟异步脚本的思考
Oct 12 Javascript
JavaScript实现图片合成下载的示例
Nov 19 Javascript
vue实现Excel文件的上传与下载功能的两种方式
Jun 28 #Javascript
开发中常用的25个JavaScript单行代码(小结)
Jun 28 #Javascript
微信小程序身份证验证方法实现详解
Jun 28 #Javascript
jQuery属性选择器用法实例分析
Jun 28 #jQuery
jQuery位置选择器用法实例分析
Jun 28 #jQuery
jQuery层叠选择器用法实例分析
Jun 28 #jQuery
jQuery内容选择器与表单选择器实例分析
Jun 28 #jQuery
You might like
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
php给一组指定关键词添加span标签的方法
2015/03/31 PHP
如何利用http协议发布博客园博文评论
2015/08/03 PHP
PHP精确到毫秒秒杀倒计时实例详解
2019/03/14 PHP
[原创]后缀就扩展名为js的文件是什么文件
2007/12/06 Javascript
利用JS解决ie6不支持max-width,max-height问题的方法
2014/01/02 Javascript
用Jquery实现滚动新闻
2014/02/12 Javascript
javascript判断office版本示例
2014/04/11 Javascript
nodejs实现遍历文件夹并统计文件大小
2015/05/28 NodeJs
js实现div拖动动画运行轨迹效果代码分享
2015/08/27 Javascript
Jquery时间轴特效(三种不同类型)
2015/11/02 Javascript
Bootstrap每天必学之折叠(Collapse)插件
2016/04/25 Javascript
完美解决IE9浏览器出现的对象未定义问题
2016/09/29 Javascript
解决bootstrap下拉菜单点击立即隐藏bug的方法
2017/06/13 Javascript
Vue.js常用指令的使用小结
2017/06/23 Javascript
vue-cli+webpack项目 修改项目名称的方法
2018/02/28 Javascript
vue脚手架及vue-router基本使用
2018/04/09 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
2019/09/16 Javascript
Vue.js页面中有多个input搜索框如何实现防抖操作
2019/11/04 Javascript
[52:03]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第三场 1月31日
2021/03/11 DOTA
如何利用Python模拟GitHub登录详解
2019/07/15 Python
Python 仅获取响应头, 不获取实体的实例
2019/08/21 Python
django xadmin中form_layout添加字段显示方式
2020/03/30 Python
python使用正则表达式匹配txt特定字符串(有换行)
2020/12/09 Python
AmazeUI 输入框组的示例代码
2020/08/14 HTML / CSS
美国在线自行车商店:Jenson USA
2018/05/22 全球购物
美国知名的隐形眼镜电商:Contacts America
2019/11/19 全球购物
PHP面试题及答案一
2012/06/18 面试题
网络工程师面试(三木通信技术有限公司)
2013/06/05 面试题
介绍一下write命令
2014/08/10 面试题
初入社会应届生求职信
2013/11/18 职场文书
小学生环保倡议书
2014/05/15 职场文书
优秀研究生主要事迹
2014/06/03 职场文书
老人节标语大全
2014/10/08 职场文书
2014年幼师工作总结
2014/11/22 职场文书
mysql查询的控制语句图文详解
2021/04/11 MySQL