Element-ui，radio中有两个相同的value,但根据text不同，只显示其中一个的办法

最新推荐文章于 2024-08-26 02:19:44 发布
最新推荐文章于 2024-08-26 02:19:44 发布
阅读量2k 收藏
点赞数
分类专栏： Element
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_46129241/article/details/103984209
版权
本文介绍了在使用Element-ui的radio组件时，如何处理具有相同value但不同text的情况。通过将radio的value设置为字符串来区分选项，并展示了对应的HTML和JS代码示例，以确保在选择时能正确显示并处理值的相加减操作。
摘要由CSDN通过智能技术生成

最近在做项目过程中用到lelement-ui中的radio。其中有一个radio组，有三个选项，但其中两个选项的value是一样的，但是要根据text的不同进行区分。最后把得到的各个radio组得到的value值相加减。
HTML

<template>
  <el-radio-group v-model="radio">
    <el-radio :label="1">优：1分</el
最低0.47元/天 解锁文章
深海中有鱼
关注
专栏目录
前端开发模块VUE-Element UI学习笔记
旺仔Sec&blog
08-12 8401
基于 Vue 的一套桌面端组件库，提前封装好的 UI 模板，方便开发者快速搭建一个网站前端界面。官网：https://element.eleme.cn/
elementUI单选框radio传值
热门推荐
a932946893的博客
08-29 1万+
elementUI单选框radio传值问题 从后端查询到单选框的文本及id，在表单中遍历出单选按钮，在提交表单时需要向后台提交id而不是文本值 后台提供的单选数据： 原先写的代码： :label的值会绑定到v-model上，这样写的话传给后台的是文本值。 修改过后： <el-radio-group v-model="form.type_property"> &l...
Jquery radio的name值不一样，只能选中一个
qq_38047454的博客
12-25 1703
$(document).ready(function(){     $("input:radio").click(function(e){            var tag = e.srcElement || e.target;             $("input:radio").val('0').removeAttr("checked");             $(this
el-radio-group单选按钮选中一个就全部选中问题解决
最新发布
weixin_32060735的博客
08-26 165
问题情景 代码 登录后复制 <el-dialog title="节假日设置" v-model="holidayDialog" width="500px" append-to-body> <el-form ref="holidayFormsss" :mode...
Element 踩坑--value和label赋值不一致，分别为id,name，传入id时，不会显示该id对应的值
weixin_38779534的博客
11-15 1296
需求是这样的，我要在添加产品成功之后，带着产品类别的catId跳转到产品页面以查询此类别下的产品，这不是很简单吗，不是传进来就行了吗，OK，我们来look一look <template> <el-select @change="cateOneChange" v-model="catId" :placeholder="defaultClassOneName" size="...
radio的坑，因为name不一致，导致单选失效
month_ss_815的博客
12-28 1234
                        &lt;input type="radio" id="cnone"  name="extend"  value="" checked /&gt;                         &lt;label for="cnone"&gt;11&lt;/label&gt;                  
python中tkinter中value_Python3 tkinter基础 Radiobutton 设置相同的value值，产生连锁效果...
weixin_39947908的博客
12-16 412
Python : 3.7.0OS : Ubuntu 18.04.1 LTSIDE : PyCharm 2018.2.4Conda : 4.5.11typesetting : Markdowncode"""@Author : 行初心@Date : 18-10-1@Blog : www.cnblogs.com/xingchuxin@Gitee : gitee.com/zhichengjiu...
element-ui
大菠萝
03-27 658
type="flex"，采用flex布局，搭配justify="center|end|space-between|space-around"，默认start。:xs、:sm、:md、:lg、 :xl，响应式布局，值是占有的份数。:gutter，间隙，不会占span的份数。:span，占的份数，共24份。:offset，偏移量。
elementui 搭建布局页面路由_Vue + Vue-router + Element-ui 搭建一个非常简单的dashboard demo...
weixin_39608063的博客
12-18 740
做完这个demo后，我体会到，Vue组件化，webpack, Vue-router等，并不是很难学习，你需要的只是拿起斧头的勇气在做demo的过程中，我遇到一个问题，就是vue-router懒加载一直实现不了，纠结了半天。后来回到原点，去vue-route官网看文档，发现是因为syntax-dynamic-import插件没有安装。所以说：你以为的bug, 实际上是你没看透文档初次学习这个教程，你...
vue 项目全局修改element-ui的样式
IT-精英联盟
05-13 5898
引入了element-ui，但是和我们自己的样式颜色有很大的不同， 官网自定义主题 →点击查看 修改例子： 在src文件下创建 element-var.scss，代码如下 $--color-primary: yellow; /*修改按钮primary的颜色*/ /* 改变 icon 字体路径变量，必需 */ $--font-path: '../node_modules/element-ui/lib/theme-chalk/fonts'; @import "../node_modules/ele...
vue for 循环element ui 多选按钮组 el-checkbox-group ，单选按钮el-radio-group，输入框el-input，绑定值重复问题
qq_40247562的博客
07-18 8930
前言：最近在做项目，有个做题的需求，分别有单选题，多选题，问答题，三种题型。因为题的数量不确定，所以肯定是for 循环每一道题，完了之后发现有问题； 问题： for循环之后，就会发现，这三种组件（el-checkbox-group，el-radio-group，el-input）以下简称组件。都是只绑定一个变量，来获取当前的值，所以for循环之后绑定的值是一样的，导致出现bug；例如下面的v...
el-checkbox group同时获取value和label
懒虫的博客
06-06 1357
el-checkbox group同时获取value和label
radiogroup多选_radioGroup或者checkboxGroup显示的所以选项相同
weixin_39802969的博客
12-20 118
dataTables组件常见用法 gridSelect下拉区域中如何设置显示多列 grid组件常见用法 attachment(非attachmentSimple)相关的附件组件常见用法 获取当前选中的tab页的xid或者label的值 input组件的设置焦点和控制最大长度的设置 动态创建radioGroup 调用action给object类型参数传json richTextarea修改可选择字体...
Ant Design Vue a-radio-group 取值与回显问题
m0_61177365的博客
11-23 1702
1、 使用v-decorator ：当 initialValue是字符串类型时，:value=' "" ',要想无回显问题，默认值外需多加个' '。如果:value=' 0 '是数字类型字符串，默认值必须是纯number类型，既initialValue:0。2、defaultValue或者v-model 同理，data函数中定义的默认值是字符串，每个radio的 value值必须再加一层“”，是数字类型，value值为数字类型字符串。
vue el-radio 监听选中变化的实例
weixin_43167662的博客
04-10 2467
//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>
移动端 ionic 同个页面多组相同radio使用
程序员
05-24 1714
都知道，radio是以name属性来区分的，当name一样的时候，这几个当中只能选择其中一个。 最近做问卷的页面的时候就遇到了，每个题目都有非常不满意等评价，导致一张问卷只能选择一道题的结果。 在搜狗浏览器发现 ionic的radio的name都是radio-group   所有的单选框的name都是ionic自身设置的，导致整个页面的问卷单选框的题目只能选一个 联想到这种情
ant-design-vue a-radio 默认值与反显
qq_36987708的博客
04-23 8340
基本用法： <template> <div> <a-radio-group v-model="value" @change="onChange"> <a-radio :value="1"> A </a-radio> <a-radio :value="2"> B </a-radio> <a-radio :value
el-table checkbox （解决label值相同同时变化、checkbox状态无法动态更新)
song766426的博客
08-09 3243
解决checkbox label值相同、视图无法更新问题
解决Vue中Element-UI组件使用常见问题
"关于在Vue项目中使用Element-UI框架时可能遇到的问题及解决方案的文档" Element-UI是基于Vue.js的一个流行前端组件库，提供了丰富的UI组件，如表格、按钮、下拉菜单等，用于快速构建美观的企业级前端应用。在实际...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值