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 相关文章推荐
List Installed Software Features
Jun 11 Javascript
基于jquery的页面划词搜索JS
Sep 14 Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
Sep 18 Javascript
基于jquery扩展漂亮的CheckBox(自己编写)
Nov 19 Javascript
jquery实现可横向和竖向展开的动态下滑菜单效果
Aug 24 Javascript
javascript 继承学习心得总结
Mar 17 Javascript
利用Jquery队列实现根据输入数量显示的动画
Sep 01 Javascript
jqGrid表格底部汇总、合计行footerrow处理
Aug 21 Javascript
vue简单封装axios插件和接口的统一管理操作示例
Feb 02 Javascript
手把手教您实现react异步加载高阶组件
Apr 07 Javascript
基于element-ui封装可搜索的懒加载tree组件的实现
May 22 Javascript
element tree树形组件回显数据问题解决
Aug 14 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
PHPMYADMIN 简明安装教程 推荐
2010/03/07 PHP
PHP同时连接多个mysql数据库示例代码
2014/03/17 PHP
学习php设计模式 php实现访问者模式(Visitor)
2015/12/07 PHP
PHP Class SoapClient not found解决方法
2018/01/20 PHP
thinkphp5.1框架模板赋值与变量输出示例
2020/05/25 PHP
js Form.elements[i]的使用实例
2011/11/13 Javascript
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
2012/02/10 Javascript
js Dialog 实践分享
2012/10/22 Javascript
jQuery filter函数使用方法
2014/05/19 Javascript
网站接入QQ登录的两种方法
2014/07/22 Javascript
javascript设计模式之中介者模式Mediator
2014/12/30 Javascript
JavaScript中的some()方法使用详解
2015/06/09 Javascript
jQuery实现隔行变色的方法分析(对比原生JS)
2016/11/18 Javascript
JS实现拖拽的方法分析
2016/12/20 Javascript
利用Node.js对文件进行重命名
2017/03/12 Javascript
Mongoose经常返回e11000 error的原因分析
2017/03/29 Javascript
jQuery EasyUI开发技巧总结
2017/09/26 jQuery
浅谈gulp创建完整的项目流程
2017/12/20 Javascript
深入理解webpack process.env.NODE_ENV配置
2020/02/23 Javascript
Vue页面渲染中key的应用实例教程
2021/01/12 Vue.js
Python入门_浅谈数据结构的4种基本类型
2017/05/16 Python
Python基于回溯法子集树模板解决数字组合问题实例
2017/09/02 Python
Python 将pdf转成图片的方法
2018/04/23 Python
广州某公司软件工程师面试题
2014/12/22 面试题
解释一下ruby中的特殊方法与特殊类
2013/02/26 面试题
结构工程研究生求职信
2013/10/13 职场文书
大学生专科学习生活的自我评价
2013/12/07 职场文书
大学四年的个人自我评价
2014/01/14 职场文书
员工晚婚的请假条
2014/02/08 职场文书
2014年元旦联欢会活动策划方案
2014/02/16 职场文书
项目经理聘任书
2014/03/29 职场文书
行政文员实习自我鉴定范文
2014/09/14 职场文书
2014年党委工作总结
2014/11/22 职场文书
2014年幼师工作总结
2014/11/22 职场文书
水电工岗位职责
2015/02/14 职场文书
Java设计模式之享元模式示例详解
2022/03/03 Java/Android