elementUI下拉框回显时未显示label而是显示value问题!!!

最新推荐文章于 2023-10-20 16:38:54 发布
最新推荐文章于 2023-10-20 16:38:54 发布
阅读量1.4k 收藏 1
点赞数
分类专栏： 笔记 文章标签： 前端 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/choupixiaolin/article/details/125426779
版权

**正常情况下出现这类情况的原因是由于数据类型不一致导致回显失败

**而我遇到的问题并不是这个问题,反复验证了很久,目前未找到原因,只找到了解决办法

**下拉框设置激活事件@focus 通过触发激活事件实时从localstorage中获取flownameDatas的值,数据类型统一!
**初始化值设置为空数组---flownameDatas: [ ]  回显失败

**解决办法:

初始化值设置


 

妮北鼻的学习乐园
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
2021-07-01 VUE3.0下拉框回显问题
weixin_53532986的博客
07-01 954
VUE3.0下拉框回显问题 html <el-form-item label="目前法律状态" prop="lawStatus"> <el-select v-model="form.assetHouse.lawStatus" :disabled="route.query.type === 'view'" size="small" style="width: 220px;" placeholder="请选择法律状态"> <el-option
关于下拉框数据回显得解决方案
愿你安稳的博客
08-28 1308
代码不多，理解也容易，直接上代码 关于性别的回显方式，数据是静态不变的， 如图： <select id="sex" name="sex"> <option value="1" <c:if test="${user.sex==1}">selected</c:if>>男</option> <option valu...
elementUI的el-select 默认值显示value不显示label问题
lqlq54321的博客
06-18 5867
el-select 默认值显示value不显示label问题 在做编辑页面时 需要取到列表项数据回显默认值 在做select回显的时候遇到了这个问题 明明拿到的值和value中的值一样 但是就是不转换成label 这种情况一般出现在value为数字的情况 问题 原因是 返回的数字和el-option选框里value值的类型对应不上 一个是 Numer 一个是 String 解决后如图 解决办法1 既然el-option选框需要的value属性是String类型的,可以利用row这个一行数据,拿到el-o
vue+elementui日常小问题之下拉框数据回绑直接显示value而不显示lable
ZhouPPig的博客
12-07 1520
最近在开发一个erp项目，一个人开发，so经常会碰到一些大大小小的问题，以后所有问题就都写在这个里面叭！项目前端用的是vue+elementui，后端用的springboot+mybatisplus。已经开发了一段时间，碰到的这个问题就是使用后台返回数据（id）绑定el-select的value的时候直接给我显示数字在网上搜索了该问题的解决方案试过都不行后面发现很简单：因为你下拉框绑定的时候可能value绑的是整形（int），而后台返回的是String（例如：‘1’），所以系统默认是直接显示你后台返回的字符
vue 解决element-ui中el-select显示value不显示label的问题
热门推荐
weixin_43575792的博客
03-27 1万+
项目场景： 使用element-ui中的el-select，给选择框赋值时显示的值是value不是label 如下图所示，显示内容不是label 石河子大学而是value 1 原因分析： 产生上图的情况一般是由于el-select里面的v-model和v-value参数的类型不同，即下方代码中的form.sid和item.sid的类型不一致， <el-select v-model="form.sid" placeholder="请选择学校" style="width: 100%">
elementUI选择器数据回显问题——展示value而不展示label
weixin_46709512的博客
05-26 1835
问题：elementUI选择器数据回显问题——展示value而不展示label 这种情况下，如果保证逻辑数据都没问题的话，一般是数据类型有问题。 选择器定义的el-option中的value值是number类型，然而我们获取到的数据是string类型 这样会导致我们数据回显时展示的是所谓的value，手动更改选项后又可以正常显示label 以上就是问题的整理与描述解析，如有其他疑惑可在评论区留言~ ...
el-select下拉框只回显value不回显label的原因以及解决方法
qickcao的博客
04-02 4249
el-select的采用的是map的key value结构，因此只显示value而不显示label的原因是，value的类型不正确，只需要在回显之前加上一行代码，将这个value转换成对应的类型即可，我这个里面需要的int类型，因此转成int就能回显正常。
关于elementUI下拉框value和label问题
qq_44724536的博客
08-23 2872
下拉框label和value以及模型绑定问题
vue3中弹框中的el-select下拉组件显示value而不显示label
最新发布
kanno的博客
10-20 2354
vue3中弹框中的el-select下拉组件显示value而不显示label
element-ui select选择器显示value值而不是label值的问题
yuxiangmitu的博客
07-20 6711
Element Select 选择器显示 value 而不是 label，可能是因为返回值的数据类型不匹配，需要转成Number类型。 比如当数据库返回的 value 是 bigint 类型时就不能自动匹配，如果是 varchar 类型就能自动匹配显示对应的 label 值。 this.dataForm.custId = Number(this.dataForm.custId) 如果要获取选择器的label值，可以在 el-select 选择器上添加一个change方法 @change="cu.
ElementUI 的 el-select 设置值后显示value而不是label
season_hai
03-03 8235
问题:ElementUI 的 el-select 设置值后显示value而不是label 关键是这里: <el-optionlabel="在职"value="1"></el-option> 查了下百度 主要是value值的格式不一样, 我的form.state是数字, 也就是Number类型 而value="1" 表示value是字符串类型(原生HTML默认字符串类型) 要想改成数字类型 应改成 v-bind:value="1" 这时1代表的是数字类型而...
Vue下拉框回显问题，回显默认选中随机问题
Connie1451的博客
05-16 3715
今天做vue的页面下拉框回显问题，回显数据是随机的，好奇怪，虽然多刷新 几下就可以了，但是这个问题还是存在的，后来发现问题是回显中的数据是两次请求，因为网络问题两次说不定哪个就请求的快一些，因为调用的对象不一样，所以可能会不同，改为相同的之后，发现第一次请求的时间始终比第二次时间短一些，达到想要的效果总结：1.因为第一次加载下拉框列表的时候，请求列表中所有数据和列表默认回显数据不同，所以会出现被刷...
element-plus中的el-select回显错误如何解决？
qq_40680833的博客
08-18 1790
element-plus中的el-select回显错误,类型判断===的问题
element-ui el-select组件数据回显时只显示value值,不显示label值
Ru_yin_hai的博客
03-29 3342
问题排查思路: select数据回显是一个类似于Map结构的数据类型 key就是我们的value value是我们label 当key不匹配时,则找不到label,就会按照key进行显示 一般出现此问题有两种情况 1:el-select所引用的数组对象确实没有改key值 2:key值类型不匹配,回显时可能是字符,但是数组内是数值类型,也会导致不匹配 解决: 此问题是由key值类型不匹配所导致的 ...
ElementUI el-select 不显示lable而显示value的解决
D493829844的博客
01-07 3024
1. 按照官网例子，return的的数组写死内容，如下：options: [{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶' }, { value: '选项3', label: '蚵仔煎' }, { value: '选项4', label: '龙须面' }, { value: '选项5', label: '北京烤鸭' }] 然后<el-select v-model="value" placeholder="请选择"> &l
element-UI下拉选择框的value属性说明
m0_52518047的博客
10-09 2083
element-UI下拉选择框的value属性说明 如下图所示，这是一个多选框的效果图， <el-select v-model="value1" multiple placeholder="请选择" style="width:100%;"> <el-option v-for="item in options" :key="item.code" :label="item.chinaName" :value="item.code"
element-ui的el-select总是不显示label，而是显示value
chpswg的专栏
09-08 938
element-ui的el-select总是不显示label，而是显示value， 这个问题改了无数次，结果发现是没有为el-option赋值label,
elementui select 赋值后，回显没有默认选中label，而是显示value值
凉城玖的博客
02-25 4819
bug示意图： 给 select 赋值，select 展示的却是value的数据, 不是我们想看到 label 对应的数据，而且在下方的选择列表中并没有选中传递过来的数据 这个问题一般是 select v-model 所绑定的属性的数据类型和 可以选择列表中的value的数据类型不匹配造成的。 比如： 我的 v-model 绑定的是 dialogData.weChatAutoSendMessageTaskDO.weChatRobotId ，回显就是自己主动给这个 v-model 赋值，如果你给这个 v-
vue element-ui select 远程搜索选择器的label值显示成value值的问题
qq_41328797的博客
08-27 3570
今天碰到一个很奇怪的bug，用element的远程搜索多选选择器时，选完了前面的，能够显示label绑定的值，选择器绑定的值也记录下了value的值，但是在模糊查询并且选择第二个选择的时候，第一个显示的label值会变成显示value值 下面是HTML代码 <script src="//unpkg.com/vue/dist/vue.js"></script> <s...
layui下拉框回显问题
06-14
在layui下拉框（select）中，可以通过设置select元素的value属性来实现回显。具体步骤如下： 1. 在HTML中，定义一个select元素，并设置其id和name属性。 ``` <select id="mySelect" name="mySelect"></select> ``` 2. 在JavaScript中，通过ajax请求获取下拉框的选项数据，并根据数据生成下拉框选项。 ``` //ajax请求获取数据 $.ajax({ type: "get", url: "xxx", dataType: "json", success: function(data){ //根据数据生成下拉框选项 var options = ''; $.each(data, function(index, item){ options += '<option value="'+ item.value +'">'+ item.label +'</option>'; }); //将选项添加到select元素中 $('#mySelect').append(options); //设置选中的值 $('#mySelect').val(selectedValue); //渲染下拉框 layui.form.render('select'); } }); ``` 其中，selectedValue为需要回显的值。通过设置select元素的value属性，将需要回显的值设置为选中状态。最后，使用layui.form.render('select')方法渲染下拉框即可。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值