element级联选择器中模糊搜索时getCheckedNodes()获取不到当前节点

最新推荐文章于 2024-06-03 22:20:09 发布
最新推荐文章于 2024-06-03 22:20:09 发布
阅读量2.9k 收藏 4
点赞数 2
分类专栏： elementui 文章标签： elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/NancyFyn/article/details/120079091
版权

踩了个坑…
使用getCheckedNodes()获取当前节点是ok的,但是当级联菜单模糊搜索时getCheckedNodes()获取当前节点为空.开始以为是element的版本问题,但是经查验并不是

在这里插入图片描述
在这里插入图片描述
当使用getCheckedNodes()方法获取不到节点时,我们可以使用反查的方法getNodeByValue(),去找当前节点

this.$refs[`cascader${index}`][0].panel.getNodeByValue(value)

使用此方法可以反查到节点信息,从而获取到需要的数据.

如果你有好的解决方法,烦请留下哟~

el-cascader： 使用getCheckedNodes()获取当前节点是ok的,但是当级联菜单模糊搜索时getCheckedNodes()获取当前节点为空
jieweiwujie的博客
09-14 846
【代码】el-cascader： 使用getCheckedNodes()获取当前节点是ok的,但是当级联菜单模糊搜索时getCheckedNodes()获取当前节点为空。
vue3 - element-plus组件库el-cascader级联选择器，“动态数据懒加载+回显/编辑时自动选中对应节点“ 问题，多选复选框、单选框级联选择器如何让数据回显？数据是动态加载回显咋办
高级前端工程师
06-28 1万+
elementPlus，vue3，element plus el-cascader 回显，级联选择器，回显，懒加载，el-cascader 动态加载选项、编辑时数据回显问题 、单选不加载下一级节点，级联选择器动态懒加载以及回显，解决el-cascader回显失败问题，三级联动数据回显，省市区回显，el-cascader 动态加载，编辑时数据回显，Element-plus Cascader级联选择器动态加载模式下数据回显时的问题，el-cascader列表是动态的怎么回显，赋值后，不回显怎么办，数据还没加载怎
el-cascader 搜索选中后使用 getCheckedNodes() 获取不到当前勾选节点值
qq_47525635的博客
06-03 3258
在 el-cascader 中搜索并选中值后，通过触发 change 事件发现，可以拿到该勾选节点的值（由所选选项的 value 值组成的数组），但是由于需求还需要用到选中节点的 label 值，直接使用 getCheckedNodes() 获取选中节点值为 [ ]，致使没办法拿到 label 值。就是这样，这个问题的发现还是通过业务的测试发现的，因为我都是 一级一级的选。，人家是直接搜索选中的。
el-cascader模糊搜索时getCheckedNodes()获取不到选中的节点
qq_43765727的博客
08-30 1590
把getCheckedNodes()改为改为getNodeByValue()
el-cascader级联选择器模糊搜索选中后，获取节点信息为空、模糊搜索点击之后获取的是上一次的值
qq_46663280的博客
11-27 1881
这个方法只能获取到手动点击的数据，这种方式有一个弊端，就是无法获取到“搜索条件下”的node节点，打印时getCheckedNodes为undefined，所以会出现值为空。针对无法获取到“搜索条件下”的node节点，打印时getCheckedNodes为undefined，所以会出现值为空这个问题。搜索会遇到另一个bug，当你手动清除重新搜索它获取数据的值还是删除之前选项的值，出现这个问题原因是：级联选择器会有缓存。通过getNodeByValue()方法可以获取到搜索条件下的node节点数据。
关于element-ui级联选择器输入框节点获取不到，undefined，null等问题
weixin_47945635的博客
01-06 1282
级联选择器输入框节点获取不到，undefined，null等问题。模糊搜索时就全乱套了。
详解关于element级联选择器数据回显问题
10-17
然而，在实际应用中，级联选择器的数据回显问题是一个常见的挑战，尤其是在编辑或更新表单时。本文将详细探讨 Element 级联选择器的数据回显问题及其解决方案。 首先，让我们看看问题的背景。在给定的代码段中，...
Element-UI级联选择器(Cascader)获取全路径Label
weixin_42592529的博客
10-16 3459
首先要说明的是,elemnt-ui上关于级联选择器提供了方法,获取节点 getCheckedNodes 此方法能够获取节点信息,但是在复杂的场景下,比如级联选择器是循环创建的. 有人可能要说了 那可以把ref的命名随机化,好了,我就是不爽这种好吧.....废话不多说先上效果 首先数据长这样 json = [ { value: "animal", label: "动物", ...
Vue3.0中Element-Plus级联选择器——直接输出所选中的最后一级的数据
08-08 2995
<el-cascader placeholder="试试搜索：北京" :options="options" :props="{ multiple: true }" filterable @change="checkedData" collapse-tags ref="cascadeAddr"><.
el-tree 在 v-for 中获取不到 getCheckedNodes
qq_37236395的博客
05-19 3647
element-ui 中 el-tree 在 v-for 中使用，获取不到 getCheckedNodes() 和 getCheckedKeys()，报错：Error in v-on handler: “TypeError: this.$refs.tree.getCheckedNodes is not a function” <el-tree :data="layerControl" show-checkbox node-key="id" :props="defaultProps"
el-cascader的getCheckedNodes获取值为空
weixin_45890564的博客
04-12 5804
描述:在表格中动态插入行时，每行中的el-cascader触发change事件时获取节点getCheckedNodes为空，原以为是dom节点未及时更新，使用$nextTick可解决问题，但发现并未起作用 表格添加多条时el-cascader的change事件只有最后条getCheckedNodes能获取到数据,想到用this.refs["cascader"][index].getCheckedNodes()去解决，可是发现this.refs["cascader"][index].getCheckedNo
element-ui中getCheckedKeys和getCurrentKey获取不到值的问题可能是因为node-key设置的有问题
qq_43351249的博客
07-29 1万+
后端返回的数据唯一key值是orgId，通过props属性把id和orgId以及label和orgName对应上了，此时node-key绑定的是id，而是orgId <Tree ref="tree" :props="{id: 'orgId', label: 'orgName'}" :data="groupList" :filter-node-method="nodeFilter" :current-node-key="us
elementui el-cascader组件 回显时选中但不显示的问题
007的博客
04-06 1856
el-cascader组件 回显时选中但不显示的问题
elementui中cascader的getCheckedNodes获取为空数组
shanzhuxiansheng的博客
08-24 4516
问题描述：elementui的级联选择cascader中通过搜索选取的节点后，在@change中使用获取选中节点的方法getCheckedNodes，获取结果为空数组 解决方案： 在this.$nextTick中获取，如下： handleChange(value) { this.$nextTick(() => { this.$refs['cascader'].getCheckedNodes() }) } ...
el-cascader级联选择器搜索选中后，获取节点信息为空（已解决）
FilterXX的博客
10-25 3848
踩坑： 官方提供的getCheckedNodes()方法适用于手动点击节点获取信息，但并不能获取搜索后出现的查询结果的节点信息 查询结果如上↑，选中后获取不了节点信息。 随后在网上查了一下，发现可以使用getNodeByValue方法获取，如下： <!-- HTML --> <el-cascader ref="cascader" filterable clearable v-model="formobj.value" :options="parentoptions"
bug描述：el-cascader搜索后再选中拿不到选中后的label值，getCheckedNodes()返回的还是原值，选中项高亮的也是原值
山有木兮木有枝 心悦君兮君不知
01-20 2529
问题1:el-cascader搜索后再选中拿不到选中后的label值，getCheckedNodes()返回的还是原值 elment-ui githup有一个issue解决了该问题： https://github.com/ElemeFE/element/issues/18202 问题2：el-cascader搜索后再选中，选中项高亮的也是原值 在githup issues列表中看到有大佬说可以通过改源码实现，但由于项目框架等原因，我不能去改源码，经过不断的踩坑尝试，得出以下解决方案，经测
elementUI级联选择器（Cascader）回显问题和clearCheckedNodes无效的解决方法
weixin_40235831的博客
04-09 1万+
Cascader第二次绑定值时，下拉框里选项高亮样式仍显示上一次绑定值时的状态 这个问题百度过没有人问，在el-cascader和el-cascader-panel中都有出现，终于在element的git issus中找到了解决方法，现在搬运过来 问题复现 第一次进入编辑页面的回显正常的情况 接着当我打开新增页面的时候，就会出现高亮样式仍显示上一次绑定值时的状态 或者打开另一样商品的编辑 回显...
Elementui el-cascader组件动态获取接口数据及其刷新问题
q_qman的博客
05-26 1万+
一.cascader组件调用接口动态获取数据 <el-cascader ref="areaSelect" v-if="isShowAddressInfo" v-model="ruleForm.belongName" :show-all-levels="true" :props="belongRegoinProps" :placeholder="''" @change="belongRegionChange" clearable/> data中绑定prop
element-ui cascader级联选择器，使用getCheckedNodes()获取选择对象参数信息，及如何使用props自定义设置value、label、children的键名
热门推荐
Umbrella_Um的博客
02-01 2万+
需求一： 我需要在cascader级联选择后，拿到当前选择对象的其他参数信息，而不单单只获取到选择的value值 如上图，ElementUI 提供了这个获取所选节点的信息函数 getCheckedNodes，正好解决了我需要当前节点的其他信息，不单单只是选择时返回的 value 值 需求二： 后端返回的数组，并不是cascader级联选择器默认的value，label，children怎么修改成当前的键值来循环呢？ 但至于怎么用，文档都没有给出例子，所以这里补充一下用法，直接上代码： <t
element级联选择器
最新发布
12-29
Element UI 的级联选择器支持通过 `props` 属性来自定义数据源中的字段名。当后端返回的数据结构不符合默认的 `value` 和 `label` 字段时，可以通过设置 `props` 来指定实际使用的字段[^1]。 ```javascript , ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值