在添加操作时，el-select多选下拉组件，选中label标签后，框中无法回显选中的label,,,

最新推荐文章于 2024-07-20 11:17:14 发布
最新推荐文章于 2024-07-20 11:17:14 发布
阅读量607 收藏
点赞数
文章标签： javascript vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lingrer/article/details/134313830
版权

在添加操作时，el-select多选下拉组件，选中label标签后，框中无法回显选中的label,,,

在使用el-select 组件出现一个小问题，对成功回显后的数据，再次进行添加，选框中没有更新，但是提交表单，实际数据是更新的。怀疑可能是视图层没有更新，组件化框架类似问题。

原因 ：下拉框数据是循环别的接口得来的，因为数据层次太多，render函数没有自动更新，需手动强制刷新

解决方法：添加 @change="$forceUpdate()" 强制更新视图

小李很认真
关注
vue2 - 详细介绍element UI中在el-select嵌套el-tree树形控件实现下拉选择树型结构数据的效果实例（组件封装）
前端充电宝
03-03 1182
element UI中在el-select嵌套el-tree树形控件实现下拉选择树型结构数据的效果实例
vue中el-select下拉框 编辑数据回显，数据回显了，但是，下拉中没有选中
m0_73967790的博客
05-31 1278
js:回显数据是后端给的data,直接复制是错的 后端给的data.flowReleaseMetadas=[ {flowReleaseMetadataId: 1, flowReleaseMetadataName: 'Node部署分离流程'}, {flowReleaseMetadataId: 2, flowReleaseMetadataName: 'Nod包与部署合并流程'}, {flowReleaseMetadataId: 4, flowReleaseMetadataName: 'Kubes打包与部}]
elementUI 使用 el-select 的远程搜索功能，导致数据无法回显怎么解决？
热门推荐
小陈的博客
05-26 1万+
如果有同学还没用过这个功能，可以先了解下： 使用场景 大部分情况下使用 el-select 的时候，el-options 中 options 的值都是后端接口给的数据，直接赋值就可以了。但是有的时候数据量比较大，比如几千甚至上万条的时候，如果直接赋值，整个页面的 dom 会被撑爆，不仅请求全量数据接口的时候时间会很久，而且赋值完之后整个页面会非常卡。 解决方法 现在的 elementPlus 已经有虚拟化选择器了，直接使用，非常方便，如果你使用的是Vue3，可以直接移步 elementPlus官方文档 如
项目中会遇到的问题，el-select组件不回显，数据多选保存空白问题
weixin_43204464的博客
10-24 6050
2.如果绑定正确，可能是属性值数据类型不正确，比如，我的问题就是后台el-option绑定的数组，里面的id是number类型，而这一条数据给的id、是string类型，所以不回显label，只回显value。1.检查属性是否绑定正确，比如value绑定的数据，是否和数组的：key一致。label是否绑定的是要回显的数据。
【Element-Plus】el-select选择后不回显问题
qq_63514555的博客
06-15 1367
因此我们需要的是string类型，但是实际上我们给el-select绑定的是。Vue3 Element-Plus Setup语法糖。（object类型），导致一直绑定不上。到底还是setup语法糖不熟啊🤦‍♀️。el-select上面我们绑定的就是。首先说一下我用的技术。
el-select不回显
qq_38126315的博客
01-24 657
v-model赋值了，但是不显示选中状态，只有框内有值。是赋值错误了，想当然的给v-model赋值了如下格式。
在编辑操作时，el-select多选下拉组件，选中label标签后，框中无法回显选中的label,,,
qq_41930094的博客
04-01 1163
3.柳暗花明：在网上寻觅方案无法解决之后，我冷静下来思考，为什么新增的时候我不出现这种问题，编辑的时候下拉组件就无法选中新的label进行显示，后面我想应该是出在数据格式有啥问题，排查代码，最后突然想到是不是我在封装表格数据渲染完成后依旧使用的是浅拷贝方式，导致一直引用的是同一个内存地址，导致后面下拉组件点击新的时候，无法做到回显最新，而依旧使用老的内存里值展示？想着，反正就是死马当活马医，试试看，然后，，，，，啊啊啊，正常了！，而change事件中监听已获取最新选中的Label。
element-ui 远程搜索组件el-select在项目中组件化的实现代码
10-15
Element-UI的`el-select`组件是用于创建下拉选择框的，它提供了丰富的功能，包括远程搜索（remote search）。远程搜索在大型数据集或动态获取数据的情况下非常有用，因为它只在用户输入时向服务器请求数据，提高了...
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
10-18
在使用Vue.js框架结合Element-UI组件库开发应用时，el-select选择器是一个常用的组件，用于实现下拉列表选择的功能。然而，在使用过程中可能会遇到一些问题，比如选择器无法显示选中的内容。这个问题可能会让开发...
el-select多选如何回显
02-20
el-select是Element UI中的一个下拉选择组件，可以用于单选或多选。当使用el-select进行多选时，回显已选项的方式有两种： 1. 使用v-model绑定一个数组，数组中存储已选项的值。例如，将v-model绑定到一个名为...
解决el-select回显value，不显示lable，以及之后不能操作的问题
qq_45779588的博客
04-11 863
el-select v-model="addData.classifyIdsList" placeholder="请选择" multiple @change="$forceUpdate()">不能操作 加@change="$forceUpdate()"
avue行编辑el-select选择数据后未回显
qq_38295468的博客
08-10 2628
很多时候后台传的number，但是我们的封装可能写成了string，就会找很久找不出来。很多时候，我们表单里面嵌套表格，表格里面又有表单；多层嵌套的情况下，就会导致prop值忘记写了，所以一定不要忘记加slot-scope=“{ row, index }”。有时候因为vue2双向绑定的原理导致无法完全监听数组，所以在刷新时无法回显，可以尝试用this.$set()方法去更新内容。关于avue-crud的使用过程中，遇到很多次在表格中编辑数据时，无法回显下拉数据；根据多次经验总结出几个原因；
element ui + vue项目,el-select选择器,选中值后无法及时回显到页面上
m0_45317632的博客
04-06 1693
element ui + vue项目,el-select选择器,选中值后无法及时回显到页面上
element下拉选择组件（el-select）绑定数据在方法中改变，但是不回显（同样方法可解决下拉选择数据后，不变化，即无法选择）
最新发布
m0_73463767的博客
07-20 360
/
使用Element-Ui的el-select组件无法选中回显的问题
Jack, what else can you do besides holding your little darling?
09-13 1107
最近在实习开发中使用了Element-Ui的select组件,在选择上级科目下拉后出现了下拉无法回显的情况,但是在科目名称一填内容,上级科目马上就回显了的情况。 经过排查也并不是下拉框绑定的值有问题,最后是使用了Vue 官方提供了 vm.$forceUpdate() 方法才解决的。 此方法的作用是迫使 Vue 实例重新渲染。 解决代码: 在对应的select组件增加@change事件,事件对应为$forceUpdate()即可 ...
Element中el-select下拉框无法回显
fdyputi的博客
10-10 7406
使用elementUI时，在页面编辑时，下拉框回显数据有问题 这里主题类型默认选中类型为1的主题，并显示主题类型 <el-form-item label="主题类型" prop="subjectType"> <el-select v-model="form.subjectType" placeholder="请选择" clearable filterable> <el-option v-fo
el-select下拉框远程搜索且多选时，编辑需要回显的一个简单案例
天渺(喵)工作室
04-21 3897
前端业务开发中不管使用vue2~3，还是react，angular各种前端技术栈，经常会遇到这种业务。一个下拉框Select中，不仅需要需要**支持远程模糊搜索，还需要支持多选。并且在编辑时，还能正常把已经多选好的内容回显到Select中。** #### 用Vue3+ElementPlus+TS举一个简单的案例。
Element Plue -- el-select绑定对象不能回显问题
这里是迷阵的博客耶
05-05 1441
el-select绑定对象不能回显的解决方案
使用Element-Ui的el-select组件遇到无法选中回显的问题
d_append的博客
07-10 6169
最近在实习开发中使用了Element-Ui的select组件,在选择上级科目下拉后出现了下拉无法回显的情况,但是在科目名称一填内容,上级科目马上就回显了的情况。 经过排查也并不是下拉框绑定的值有问题,最后是使用了Vue 官方提供了 vm.$forceUpdate() 方法才解决的。 此方法的作用是迫使 Vue 实例重新渲染。 解决代码: 在对应的select组件增加@change事件,事件对应为$forceUpdate()即可 小菜记录开发过程中的。 ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值