elementPlus 反显el-select多选，只反显了id，没有名称

于 2024-09-09 17:26:58 发布
阅读量597 收藏
点赞数 4
分类专栏： 前端 文章标签： vue.js elementui 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42172974/article/details/142064564
版权

elementPlus 反显el-select多选，只反显了id，没有名称

原因 ：

el-select的v-model数组中元素和接口返回的数组中元素类型不同，一个是字符串一个是数字类型

解决办法 ：

数组中字符串转换下数字，或者数字转换下字符串，即可解决

BJ-Giser
关注
专栏目录
vue3 Element-Plus封装的el-tree-select的使用
宁波阿成的博客
03-25 2952
vue3 Element-Plus封装的el-tree-select的使用
el-select的某一项选中后显示id
zhangyu_98的博客
09-22 770
el-select的某一项选中后显示id
关于element-UI的el-select下拉框数据回填显示的id问题
SYXZSs的博客
01-25 7942
关于element-UI的el-select下拉框数据回填显示的id问题 问题如图： 三个form-item都是使用el-selece，但是责任人一栏却显示为id 问题情况 是后台返回的数据类型的原因。 我在接口获取的function里 循环责任人的id，打印类型为number。此时以这样的情况可以判断为id应该属于String类型。 如下图：我使用map更改原数组，使其id转为String再重新赋值给id。整个数组再赋值给空数据，这样再绑定el-select就不会出现数据回填显示id的情况了！
vue el-select 下拉框选择后,不显示
weixin_39891473的博客
12-13 2472
问过度娘后得知, 是因为数据层数太多, render函数没有更新,在select 里添加以下代码。使用forceUpdate手动强制刷新。
element ui Select下拉选择默认值显示数字不是文字
cc蒲公英的博客
10-25 574
element ui Select下拉选择默认值显示数字不是文字
使用elementUI的select，当没有匹配的时候默认显示value值；
Lee_yuki
10-18 3081
使用elementUI的select，当没有匹配的时候默认显示value值； 问题：多处页面用到了相同的选择，为避免多次请求接口，选项列表存到了localstrage中，对选项增删改时，更新localstrage。但是有些时候后端接口返回的value值，已经删除了，localstrage中无法匹配到对应的label，回显显示value值。 解决：在公用表单组件中，如果type为select，循环localstrage的数组，如果没有匹配到的，设置该表单值为空 ```javascript this.item
element-ui 远程搜索组件el-select在项目中组件化的实现代码
10-15
Element-UI的`el-select`组件是用于创建下拉选择框的，它提供了丰富的功能，包括远程搜索（remote search）。远程搜索在大型数据集或动态获取数据的情况下非常有用，因为它只在用户输入时向服务器请求数据，提高了...
vue+element框架 el-select分组展示，允许多选情况下，组内元素只能单选,并且两个下拉框同一个组选过的项禁选
weixin_39948052的博客
04-07 3014
el-select分组展示，允许多选情况下，组内元素只能单选,并且两个下拉框同一个组选过的项禁选
el-table 分页多选
weixin_44910986的博客
07-30 1888
<el-table :data="consultationMen" @select="selectChange" @select-all="selectAll" ref="multipleTable" :header-cell-style="{background:'rgba(245,247,250,1)'}"> data（）{ selectDataArrL...
Vue3+ Element-plus，使用el-select 循环多个下拉选择框时，选项option不能重复被选；选择后的option，在别的下拉中显示禁用状态
最新发布
Shivy_的博客
04-17 1312
Vue3+Element-plus，循环多个下拉框时，option不能重选
用el-select处理后台数据进行页面渲染，返回数据如果为空或者无法渲染文字时的处理
yzx125的博客
03-12 3710
用selecet处理后台数据进行页面渲染 最近用select做下拉选择器的时候，出了一些bug。具体表现为无法从后台渲染数据到选择器中或者选择器中的文字不显示。 我的返回数据是这样的： 组件部分： <el-select v-model="name" placeholder="请选择" @change="handleChange2()" clearable :options="options2" :props="optionProps2">//v-model的值根据自己的需
element中的el-select中多选回显数据后没法重新选择和更改
在北风吹起的时候加入我们的队伍 在秋雨到来的时候成为彼此的温暖
07-07 575
element中的el-select中多选回显数据后没法重新选择和更改
el-select选择之后值不显示在文本框的问题解决
前端笔记——放弃很容易,但坚持一定很酷
01-24 1087
在el-collapse-item中使用子组件，子组件里是el-form-item代码。el-select在for循环中，可以有多个。查了一下博客，有的说这种场景需要给el-select添加@change事件，加上 this.$forceUpdate() 强制刷新即可。也有说使用this.$set去设置，但都不适用我的场景，试了没效果。处理：在子组件的根节点上，加上了一个class属性之后，问题修复。
el-select多选回显数据
qq_36935391的博客
12-28 948
el-select多选回显数据 el-select多选回显数据 el-select多选回显数据 el-select多选回显数据
【element Vue】＜el-select＞回显问题，应该回显 label 却只显示了id
AAAXiaoApple的博客
06-08 1万+
回显问题，应该回显 label 却只显示了id
使用element ui select下拉框多选，编辑状态下回显数据
热门推荐
wangyuanjun008的博客
01-24 5万+
最近在做一个项目,项目的后端是地址:https://github.com/wangyuanjun008/wyj-springboot-security.git 前端地址是 https://github.com/wangyuanjun008/wyj-vue-security.git ,使用的前端语言是vue,使用webpack构建vue-cli全家桶 在项目中使用的是 element ui 组件
Element Select选择器绑定对象，多选，回显处理
crazybai0001的博客
10-28 1万+
有些时候Select选择器需要多选、绑定对象，用户选择某项后（change事件），得到的值是一个对象，得到对象后可以获取对象的某些属性，以便做进一步处理，数据提交入库后，进行编辑操作，此时根据需求可能还需要正确定回显之前新建时选择的多个列表项，本文对些功能实现做简单整理、解释。
关于element的select多选选择器，数据回显的问题
weixin_34179762的博客
02-19 6822
关于element的select多选，数据回显的问题 在工作中遇到这样一个问题，新建表单时用element的select多选以后，在编辑的时候打开表单发现其他数据能正常显示，多选却无法正常回显。在网上找了很多后，终于解决了这个问题，下面把百度的方法总结一下。 首先：表单中 &lt;el-select v-model="t...
.el-select 多选只显示一行
07-28
你可以使用 `el-select` 的 `collapse-tags` 属性来实现多选只显示一行。将该属性设置为 `true`，当选中的选项超过一行时，会自动折叠显示为一个 tag。这样可以限制多选的显示高度，保持只显示一行。 示例代码如下： ```html <el-select multiple collapse-tags v-model="selectedOptions"> <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option> </el-select> ``` 在上面的示例中，`selectedOptions` 是绑定的选中值数组，`options` 是可选项数组。当选中的选项超过一行时，会以 tag 的形式折叠显示。 你可以根据自己的需求调整 `el-select` 的样式和其他属性来满足你的要求。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

BJ-Giser

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值