element-ui循环显示radio控件信息的方法


Posted in Javascript onAugust 24, 2018

如下所示:

<el-form-item label="线路类型:" prop="isGive">
   <el-radio-group v-model="currentLine.isGive">
   <el-radio :label="item.id" :key="item.id" v-for="item in isGive" >{{item.name}}</el-radio>
   </el-radio-group>
  </el-form-item>
data () {
  return {
  merchantId: 0,
  centerDialogVisible: false,
  lineList: [],
  portOptions: [],
  isGive:[
   {
   id : "n",
   name : "购买"
   },
   {
   id : "y",
   name : "赠送"
   }
  ],

根据接收到的数据

currentLine.isGive

来决定显示购买和赠送,如果不写{{item.name}}那么默认显示的是radio所绑定的:lable的值,如果想要使不同的选项显示,要在data中建一个json数据,结构代码中插入{{item.name}}来取代默认的显示值。

以上这篇element-ui循环显示radio控件信息的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery live
May 15 Javascript
Script的加载方法小结
Jan 12 Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 Javascript
深入探寻javascript定时器
Jan 02 Javascript
浅谈JavaScript中小数和大整数的精度丢失
May 31 Javascript
利用vue实现模态框组件
Dec 19 Javascript
JS定时检测任务任务完成后执行下一步的解决办法
Dec 22 Javascript
jQuery遍历节点方法汇总(推荐)
May 13 jQuery
使用原生js写ajax实例(推荐)
May 31 Javascript
js实现动态添加上传文件页面
Oct 22 Javascript
vue路由切换之淡入淡出的简单实现
Oct 31 Javascript
解决新建一个vue项目过程中遇到的问题
Oct 22 Javascript
vue-cli2打包前和打包后的css前缀不一致的问题解决
Aug 24 #Javascript
解决vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效问题
Aug 24 #Javascript
AngularJS自定义表单验证功能实例详解
Aug 24 #Javascript
Vue源码解读之Component组件注册的实现
Aug 24 #Javascript
element-ui 关于获取select 的label值方法
Aug 24 #Javascript
微信小程序用户信息encryptedData详解
Aug 24 #Javascript
element-ui 中的table的列隐藏问题解决
Aug 24 #Javascript
You might like
PHP ADODB实现分页功能简单示例
2018/05/25 PHP
PhpStorm+xdebug+postman调试技巧分享
2020/09/15 PHP
自己做的模拟模态对话框实现代码
2012/05/23 Javascript
jQuery Migrate 1.1.0 Released 注意事项
2014/06/14 Javascript
javascript引用类型之时间Date和数组Array
2015/08/27 Javascript
vue.js如何更改默认端口号8080为指定端口的方法
2017/07/14 Javascript
js和jQuery以及easyui实现对下拉框的指定赋值方法
2018/01/23 jQuery
说说node中的可读流和可写流的区别
2018/06/01 Javascript
实例详解ztree在vue项目中使用并且带有搜索功能
2018/08/24 Javascript
微信小程序实现单选选项卡切换效果
2020/06/19 Javascript
Node.js从字符串生成文件流的实现方法
2019/08/18 Javascript
jQuery实现动态加载瀑布流
2020/09/01 jQuery
Python Web服务器Tornado使用小结
2014/05/06 Python
python图像处理之反色实现方法
2015/05/30 Python
Python实现的登录验证系统完整案例【基于搭建的MVC框架】
2019/04/12 Python
Python中拆分字符串的操作方法
2019/07/23 Python
详解python中__name__的意义以及作用
2019/08/07 Python
python2与python3爬虫中get与post对比解析
2019/09/18 Python
python 操作hive pyhs2方式
2019/12/21 Python
Python 统计位数为偶数的数字代码详解
2020/03/15 Python
python中time.ctime()实例用法
2021/02/03 Python
CSS3制作翻转效果_动力节点Java学院整理
2017/07/11 HTML / CSS
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
Notino意大利:购买香水和化妆品
2018/11/14 全球购物
电气自动化自荐信
2013/10/10 职场文书
升职自荐书范文
2013/11/28 职场文书
2014学年自我鉴定
2014/02/23 职场文书
《骆驼和羊》教学反思
2014/02/27 职场文书
历史专业学生的自我评价
2014/02/28 职场文书
2014个人年终工作总结范文
2014/12/15 职场文书
酒店辞职书怎么写
2015/02/26 职场文书
2015年转正工作总结范文
2015/04/02 职场文书
有关水浒传的读书笔记
2015/06/25 职场文书
学雷锋主题班会教案
2015/08/13 职场文书
MySQL8.0的WITH查询详情
2021/08/30 MySQL
MYSQL 的10大经典优化案例场景实战
2021/09/14 MySQL