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 相关文章推荐
srcElement表格样式
Sep 03 Javascript
js匿名函数的调用示例(形式多种多样)
Aug 20 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
Jan 13 Javascript
微信小程序 video详解及简单实例
Jan 16 Javascript
vue better-scroll插件使用详解
Jan 25 Javascript
在 React、Vue项目中使用SVG的方法
Feb 09 Javascript
webpack external模块的具体使用
Mar 10 Javascript
vue axios请求超时的正确处理方法
Apr 02 Javascript
微信小程序实现星星评价效果
Nov 02 Javascript
Jquery实现获取子元素的方法分析
Aug 24 jQuery
JavaScript实现电灯开关小案例
Mar 30 Javascript
解决vue项目中某一页面不想引用公共组件app.vue的问题
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
PHP微信公众号自动发送红包API
2016/06/01 PHP
Yii2简单实现多语言配置的方法
2016/07/23 PHP
PHP排序二叉树基本功能实现方法示例
2018/05/26 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
jquery判断单个复选框是否被选中的代码
2009/09/03 Javascript
为JavaScript提供睡眠功能(sleep) 自编译JS引擎
2010/08/16 Javascript
js 代码优化点滴记录
2012/02/19 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
2015/09/06 Javascript
温习Javascript基础语法之词法结构
2016/05/31 Javascript
js利用正则表达式检验输入内容是否为网址
2016/07/05 Javascript
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
jQuery实现的简单在线计算器功能
2017/05/11 jQuery
Vuex mutitons和actions初使用详解
2019/03/04 Javascript
一篇文章,教你学会Vue CLI 插件开发
2019/04/17 Javascript
vue element-ui实现input输入框金额数字添加千分位
2019/12/29 Javascript
nodejs+koa2 实现模仿springMVC框架
2020/10/21 NodeJs
Python Logging 日志记录入门学习
2018/06/02 Python
Tensorflow 查看变量的值方法
2018/06/14 Python
Pandas读写CSV文件的方法示例
2019/03/27 Python
Python实现时间序列可视化的方法
2019/08/06 Python
python对Excel按条件进行内容补充(推荐)
2019/11/24 Python
利用pyecharts读取csv并进行数据统计可视化的实现
2020/04/17 Python
ubuntu16.04升级Python3.5到Python3.7的方法步骤
2020/08/20 Python
python中字典增加和删除使用方法
2020/09/30 Python
python opencv实现直线检测并测出倾斜角度(附源码+注释)
2020/12/31 Python
HTML5中的websocket实现直播功能
2018/05/21 HTML / CSS
小天鹅官方商城:LittleSwan
2017/06/16 全球购物
英国玛莎百货澳大利亚:Marks & Spencer Australia
2019/08/30 全球购物
材料加工工程求职信
2014/02/19 职场文书
求职面试个人自我评价
2014/02/28 职场文书
党员先锋岗事迹材料
2014/05/08 职场文书
声乐专业大学生职业生涯规划书:理想的未来需要自己去打造
2014/09/20 职场文书
2015年学校工作总结范文
2015/04/20 职场文书
python3 hdf5文件 遍历代码
2021/05/19 Python
Mysql binlog日志文件过大的解决
2021/10/05 MySQL
Java 中的 Lambda List 转 Map 的多种方法详解
2022/07/07 Java/Android