element，下拉，渲染，传的id，展示id，不展示name

最新推荐文章于 2024-07-15 22:54:01 发布
最新推荐文章于 2024-07-15 22:54:01 发布
阅读量1.1k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 难点 element 文章标签： elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/zxp_smile/article/details/123554186
博客内容涉及了两个主要问题：一是系统中找不到匹配的id，这可能导致下拉列表无法正确显示；二是传入的id不是整数类型，因此只能显示id本身而无法展示对应的name。这些问题涉及到数据验证和接口交互的细节。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

（1）传的id，在下拉数组里没有对应的id

（2）传的id，格式不对，不是int类型，就会只展示id，不展示相对应的name

vue使用el-select下拉框匹配不到值的优化方案，el-select显示，当选择框的选项无法与选择框的value值匹配时，不显示value值的处理办法
King Saj
01-03 5686
新建表单数据，下拉框选项一般从接口获取的数据列表，比如后期某个数据关停了，这条数据就会被删除，导致我们取不到这条数据。就会出现 el-select下拉框匹配不到值的情况。所以我们要处理这种情况的。
【商城实战(42)】Element PLUS：解锁PC前端响应式设计的秘密武器
最新发布
邓邓子的博客
03-17 1093
本文聚焦 Element PLUS 在商城 PC 前端响应式设计中的应用。开篇点明数字化时代响应式设计重要性，阐述 Element PLUS 为此提供有力支持。详细介绍其栅格系统构建响应式布局的原理及不同屏幕尺寸下的布局演示，讲解结合媒体查询优化组件样式的方法及实例。针对移动端，提出多种适配策略及对具体组件（如 el - table、el - dialog 等）的优化措施。总结 Element PLUS 当前的作用，展望其未来在功能扩展、适应新技术发展及与其他技术融合等方面的广阔前景，助力电商前端开发进步。
UI组件库（element 、antdesign 等）下拉组件值为id不回显的坑
2401_85955297的博客
07-15 847
UI组件库（element 、antdesign 等）下拉组件值为id为number类型不回显的坑
element-UI el-select组件 展示名称，选择的时候，获取选中的id
weixin_45923100的博客
08-11 3633
参考网址：https://segmentfault.com/a/1190000020137115 感谢老哥，不然我都打算用循环遍历了，十分麻烦。（直接截图借用老哥的了，写的十分清楚）
vue2+elementUI，vue3+elementPlus解决form中的下拉列表回写显示id，不显示label
sumimg的博客
10-10 1917
这是我自己实验出来的代码，效果是好的，如有不足或者有更好的方法，欢迎指正探讨。直接字符串转数组，转出来的类型是 [‘1’,‘4’,‘3’,‘2’]需要把数组中的字符串转成数字类型 [1,4,3,2]，使用。vue3中表单的回写方式如下：（不是写在一起，单独排列开）但是elementplus中需要的是数字类型的数组。后端给的数据是字符串类型的 1,4,3,2。
vue+element ui的下拉框回显问题
weixin_44188501的博客
09-07 3036
最近在使用vue+element ui做下拉框回显的时候遇到了一个错误。下拉框列表正常显示，我要回显的话就要给绑定的model属性赋一个标签中对应的:value的值，但是奇怪的是下拉框没有回显而是显示了model属性的值。 一开始以为是我查询出来的数据不对劲，我打印出来没看出有什么问题。 百思不得其解。检查发现也不是vue生命周期的问题。 后来静下心仔细看了一下，发现我:value的值是字符串，而回显赋值给model属性的是数字。 把model绑定的属性值改成字符串后完美解决。 ...
element做树形下拉_手把手教学~基于element封装tree树状下拉框
weixin_34792272的博客
02-15 2170
在日常项目开发中，树状下拉框的需求还是比较常见的，但是element并没有这种组件以供使用。在这里，小编就基于element如何封装一个树状下拉框做个详细的介绍。通过这篇文章，你可以了解学习到一个树状下拉框组件是如何一步一步封装成功的。话不多说，先看效果图：封装组件该组件主要基于element的select组件、tree组件及input组件进行二次封装的。组件布局首先我们需要基于这几个组件对我们的...
element-ui中select下拉框加载大数据渲染优化
donggua_123的博客
04-27 7489
现在的前端项目中对于element-ui的使用几乎已经是一个常规动作了，但是组件库中的ui组件不一定都能满足实际场景的需求，比如今天要讲的select下拉框选择组件。 我们公司是做证券行业基础设施的，股票和证券的数量动不动就是上千，当使用select渲染的时候就会很有压力，我司大致3000条数据，全部渲染出来大致需要4s左右，并且多选模式时，选中和反选时会明显感觉卡顿，这在体验上是觉得不能接受的...
vxe-table编辑表格使用element 下拉选项
01-07
为了实现在 `vxe-table` 中使用 `element-ui` 创建带有下拉选项的可编辑单元格，可以利用 `edit-render` 属性来指定列的编辑模式，并通过自定义渲染器引入 `el-select` 组件。 #### 定义数据源和表格配置 首先，在...
利用vue+element ui渲染城市列表
07-20
在这个示例中，我们使用了`el-select`和`el-option`组件来实现下拉选择框，并通过`v-for`指令循环渲染城市列表。 你可以根据实际需求修改`cities`数组中的城市数据，或者从API中获取城市数据，并将其绑定到`el-...
element-UI中select下拉框不能正确显示的问题
小太阳的博客
04-14 8242
场景：项目中人脸设备管理信息以表格的形式展示，一个人脸识别设备只能被绑定一次，所以下拉框只能显示未被绑定的设备名称（只要设备被绑定使用，后端返回的下拉框数据就会删掉这一条被绑定的数据），当表格数据需要编辑的时候，编辑和新增不一样，需要数据回显，那么回显的时候是拿不到当前设备的名称的，所以会回显id。因为未绑定的设备数据里面已经不存在当前这一条数据了。 需要用的是：element中的select选择...
select中显示的是内值而不是名字+显示值在下拉列表中没有选中
SanOrintea的博客
09-07 391
问题1;select中显示的是内值而不是名字 是因为html中value没有动态绑定 <el-select v-model="xxxxxx[n-1]"> <el-option label="无" :value="255"></el-option> <!-- 这里的 ↑--> <el-option v-for="n in 60" :key="n" :l
element-ui中的el-select下拉框选中不显示问题
weixin_46178852的博客
07-07 4717
今天在使用element-ui的el-select时出现了一个奇怪的问题，就是在做一个三级联动的功能时，我选中了市区下拉框的内容之后但是下拉框中不展示选中的label值，并且检查时控制台也没有任何代码报错日志。 关于选择城市时，下拉框不显示城市名的问题 问题原因：vue 无法监听动态新增的属性的变化，需要用 $set 来为这些属性赋值。 以上操作即可解决上述问题 ...
多选下拉框回显由于后端返回的是id需要前端自己进行比较来转换成汉字状态然后放到文本上
bbkhhvv的博客
12-16 1093
多选下拉框查看回显由id转换成汉字
Elementui select选中值绑定为对象时，不显示选中名称
Yuval的博客
12-27 4401
问题： 在使用Element的Select下拉选择框时，设置其选中返回值是Object类型时，选中后Select框不显示选中目标的信息。 例如下面图片选中赵云，下拉框会不显示选中的选项相关信息。 原因： Select组件默认会显示v-model绑定值，当选中为Object类型时，无法识别对象类型，所以显示会出现错误。 解决方法： 使用Select组件的官方属性值value-k...
vue el-select 下拉框选择后,不显示
weixin_39891473的博客
12-13 3078
问过度娘后得知, 是因为数据层数太多, render函数没有更新,在select 里添加以下代码。使用forceUpdate手动强制刷新。
element-ui中select选择框渲染文字内容但是获取的是列表的id
weixin_45803990的博客
12-29 1853
label表示的是列表渲染的内容，value是change中绑定的值。 <el-select v-model="value" placeholder="请选择" @change="selectChange"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.id"> </el-opti
使用elementui select下拉框多选，编辑状态下回显数据问题
qq_37263478的博客
06-29 1472
类型错误，我的天！
element-ui下拉框回显id,不能回显值
qq_53769810的博客
07-18 1765
el-option中的value的值要和el-select的v-model是同一类型,才会回显。如图,id值类型为字符串,v-model绑定的值类型也为字符串,才会成功回显。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值