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 相关文章推荐
让getElementsByName适应IE和firefox的方法
Sep 24 Javascript
AJAX分页的代码(后台asp.net)
Feb 14 Javascript
js控制web打印(局部打印)方法整理
May 29 Javascript
jquery使用append(content)方法注意事项分享
Jan 06 Javascript
javascript实现获取浏览器版本、操作系统类型
Jan 29 Javascript
js完美解决IE6不支持position:fixed的bug
Apr 24 Javascript
Avalonjs 实现简单购物车功能(实例代码)
Feb 07 Javascript
vue 实现通过手机发送短信验证码注册功能
Apr 19 Javascript
Vue2.2.0+新特性整理及注意事项
Aug 22 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
Apr 26 Javascript
vue项目添加多页面配置的步骤详解
May 22 Javascript
微信小程序实现收货地址左滑删除
Nov 18 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
discuz 首页四格:最新话题+最新回复+热门话题+精华文章插件
2007/08/19 PHP
用PHP进行MySQL删除记录操作代码
2008/06/07 PHP
php ckeditor上传图片文件名乱码解决方法
2013/11/15 PHP
php使用array_rand()函数从数组中随机选择一个或多个元素
2014/04/28 PHP
基于PHP实现发微博动态代码实例
2020/12/11 PHP
为调试JavaScript添加输出窗口的代码
2010/02/07 Javascript
学习面向对象之面向对象的术语
2010/11/30 Javascript
教你在heroku云平台上部署Node.js应用
2014/07/30 Javascript
jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法
2015/03/24 Javascript
JavaScript驾驭网页-获取网页元素
2016/03/24 Javascript
Bootstrap3制作自己的导航栏
2016/05/12 Javascript
使用Javascript监控前端相关数据的代码
2016/10/27 Javascript
js鼠标移动时禁止选中文字
2017/02/19 Javascript
jQuery插件HighCharts绘制2D带有Legend的饼图效果示例【附demo源码下载】
2017/03/10 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
[03:44]2015国际邀请赛选手档案—Cloud9.NoTail
2015/07/28 DOTA
[44:50]DOTA2上海特级锦标赛B组小组赛#2 VG VS Fnatic第二局
2016/02/26 DOTA
详解Python中列表和元祖的使用方法
2015/04/25 Python
Django学习笔记之Class-Based-View
2017/02/15 Python
Python函数式编程
2017/07/20 Python
详解Python开发中如何使用Hook技巧
2017/11/01 Python
Python字符串处理的8招秘籍(小结)
2019/08/13 Python
基于pytorch 预训练的词向量用法详解
2020/01/06 Python
python代码中怎么换行
2020/06/17 Python
html5中valid、invalid、required的定义
2014/02/21 HTML / CSS
印度服装购物网站:Limeroad
2018/09/26 全球购物
会计学自我鉴定
2014/02/06 职场文书
活动总结的格式
2014/05/07 职场文书
2014银行授权委托书样本
2014/10/04 职场文书
2015年党员自我剖析材料
2014/12/17 职场文书
结婚保证书
2015/01/16 职场文书
离职证明格式样本
2015/06/12 职场文书
PyTorch 如何设置随机数种子使结果可复现
2021/05/12 Python
Pytorch反向传播中的细节-计算梯度时的默认累加操作
2021/06/05 Python
B站评分公认最好看的动漫,你的名字评分9.9,第六备受喜欢
2022/03/18 日漫
Mysql排查分析慢sql之explain实战案例
2022/04/19 MySQL