el-radio遇到的一些坑

最新推荐文章于 2024-03-26 11:10:36 发布
最新推荐文章于 2024-03-26 11:10:36 发布
阅读量624 收藏
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/software20121216/article/details/105492950
版权
博客内容涉及在使用Element UI的el-radio组件时遇到的问题及解决方案。当radio选项数据来源于上一层table展开时，选择其中一个选项会导致其他展开的数据也被选中。通过根据父级table的索引来处理子级radio的选择，解决了问题1。对于问题2，即如何处理多个数据的radio选择，作者发现移除choice[props.$index].radio中的radio属性即可避免问题。
摘要由CSDN通过智能技术生成

radio下面的數據是上一層的table 展開的

問題1:選擇了其中一個，其他expand的數據都會被選中

   思路：根據父級table然後選擇了子級radio

 <el-table fit style="width: 100%;" :data="goodsData" :row-key="getRowKeys" :expand-row-keys="expands" border @current-change="toggleRowExpansion">
      <el-table-column type="expand" :label="$t('commonText.switch')" width="80px">
        <template slot-scope="props">
          <el-table label-position="left" :data="suppliersData" border fit>
            <el-table-column :label="$t('pageInquiryView.choice')" align="center" min-width="80">
              <template slot-scope="scope">
最低0.47元/天 解锁文章
低調的D吖
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
elementui中el-table和el-popover组合使用问题
qq_39703109的博客
03-02 1万+
这里写自定义目录标题elementui中el-table和el-popover组合使用问题代码对比解决方法个人的最终解决方案 elementui中el-table和el-popover组合使用问题 在我自己使用elementui 的时候遇到的坑，el-popover和el-table同时使用的时候会出现点击“取消”按钮无法关闭popover的情况，后来观察代码发现这是因为表格嵌套中的popover不像官方文档中的那样v-model中的名称和要控制的visible一一对应。 代码对比 element-ui官网
在使用element-ui中的el-radio-group 赋值后 无法选中问题
m0_70871712的博客
07-19 6348
给表单赋值，遇到了赋值成功，但单选框不会自动选中的问题。
el-radio-group 自动选择的问题，自动选择后点击没反应
sumimg的博客
06-23 3979
如果 v-model 是二级字段，而js中又设置了默认选择项，则点击无反应 v-model 改成一级对象： <el-radio-group v-model=“project_type” @change=“type_change()”> 然后在 type_change() 再把 值赋给 obj.type <el-radio-group v-model="obj.type" @change="type_change()"> <el-radio label="8" key.
vue+el-radio单选框遍历出来的时候会一起选中的问题
weixin_45646663的博客
05-20 3251
1，因为是遍历出来的v-model="itt.Result"就需要用遍历出来的每个对象中的布局作用域的元素，不能像官方API那种用的全局对象，label也需要是不一样的 <div v-for="(itt,ind) in ite.forthlist" :key="ind" class="ittContent"> <div v-if="itt.Type === 1"> <span>{{ind+1}} &nbsp;&nbsp;</span&gt
element项目实战所遇到问题汇总
态度决定一切
03-09 845
el-select 的change，在初始化页面时候，触发很多次？ 查看change是否写成了 :change，若是，改成 @change即可。
解决＜el-radio＞遇到的错误
weixin_49393290的博客
11-15 784
新增时候点击了复选框，但是点击查看时 这里的radio并没有选上 这里的inverstiggatorList，这个inverstiggatorList是点击人信息的数组。 所以这里的inverstigator呢，相当于最外层是dataForm，然后一级时inverstigatorList，inverstigator是包含再inverstigatorList里的。 duty是什么？ 一个状态，选择1为队长，2为队员。 然后把官网的代码贴上去，看看能不能展...
element-ui+vue使用时遇到的坑
tendernessxy的博客
10-27 3388
element-ui+vue使用时遇到的坑
浅谈对象数据赋值问题---我遇到的一个坑
qq_40372395的博客
05-07 728
今天在做一个大型网站表格导入的时候，我踩了一个坑，让宝宝我好忧伤，感觉智商的倒退 看到这个数据重复的问题，还以为我没错，结果狠狠打脸啊，伤心的不要不要的 话不多说，上代码，看看我的问题，以后要少犯类似的问题 <html> <head> <meta charset="utf-8"> <title>活动管理</title&gt...
Vue实现微信支付功能遇到的坑
12-29
项目用VUE+EL搭建而成，支付用EL的radio来做的 <el v-model=radio label=weixin> <i class=iconfont></i> 微信支付 推荐安装最新版微信使用 </el> <el v-model=radio label=zhifubao> <i class=ic
前端那些事20240320-前端那些事- Element ui radio属性
最新发布
qq_41632427的博客
03-26 132
【代码】前端那些事20240320-前端那些事- Element ui radio属性。
ElementUI Form：Radio 单选框
ChinaDragon10的博客
01-30 1966
ElementUI Form：Radio 单选框
ElementUI中el-radio-group使用v-model绑定是属性为String字符串类型时不回显数据
BADAO_LIUMANG_QIZHI的博客
08-13 7297
场景 结合el-radio-group元素和子元素el-radio可以实现单选组，在el-radio-group中绑定v-model，在el-radio中设置好label即可，无需再给每一个el-radio绑定变量，另外，还提供了change事件来响应变化，它会传入一个参数value。 官方示例代码： <template> <el-radio-group v-model="radio"> <el-radio :label="3">备选项</el-...
el-table 单元格插入按钮组el-radio-group
szh1127249432的博客
01-14 2665
html代码 <el-table :data="ruleForm.tabData" border style="width:100%;overflow-y:auto;" :row-style="{ height:'35px'}" > <el-table-column prop="num" label="序号">
el-radio-group 跳坑
Polly
10-19 631
el-radio-group 跳坑
el-radio-group 自动选择的问题，自动选择后点击没反应
QQ2856639881的专栏
05-06 5430
<el-radio-group v-model="obj.type" > 如果 v-model 是二级字段，而js中又设置了默认选择项，则点击无反应 v-model 改成一级对象： <el-radio-group v-model="project_type" @change="type_change()"> 然后在type_change() 再把 值赋给 ...
解决el-radio-group页面不刷新问题
青春正在燃烧的博客
08-19 2659
问题:使用v-show后el-radio-group点击后页面不刷新了，但值是改变了的。如下图所示： 解决办法：在el-radio-group加一个@change事件如： <el-form-item label-width="30px" v-if="!edit"> <el-radio-group @change="checkAddType" v-model="formData.resource"> <el-radio label="on
vue中如何给el-radio添加tooltip并实现点击跳转
yimaode的博客
03-04 2655
<el-tooltip :disabled="toolTipDisable" placement="bottom" effect="light"> <div slot="content" @click="goToRout()">{{toolTipContent}}</div> <el-radio label="3">New Youk&...
单选框el-radio-group
Sean_0819的博客
09-04 4500
【代码】单选框el-radio-group。
el-radio-group中的el-radio绑定默认值
02-29
在el-radio-group中，可以通过给el-radio设置默认值来实现绑定默认值的功能。具体的步骤如下： 1. 在el-radio-group中，使用v-model指令绑定一个数据属性，该属性用于存储选中的el-radio的值。 2. 在el-radio中，...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值