element-ui的el-autocomplete不显示下拉框中的值

最新推荐文章于 2024-07-19 14:26:17 发布
最新推荐文章于 2024-07-19 14:26:17 发布
阅读量1.4w 收藏 5
点赞数 10
分类专栏： Vue 文章标签： element-ui vue
前端小白，博客搬家掘金Xpromise，欢迎交流，撒花o(*￣▽￣*)ブ
本文链接：https://blog.csdn.net/xzz2222/article/details/89001526
版权

如图：下拉框中的数组的内容全部获取到了，但是内容就是不显示。

 

解决：这是el-autocomplete的一个坑，el-autocomplete显示的时候必须有value字段，可以在返回的对象里面手动添加一个value属性，

item.value = item.name;

备注：如果一开始显示的时候也没有列表项，也是手动添加value属性。

 

2021.05.24更新

感谢评论区大佬的指正，确实是不一定有value这个属性，指定value-key就可以解决这个问题。小白程序员的总结，如有误导大家抱歉

PromiseXuu
关注
  • 10
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
elementUi 中的 el-autocomplete 组件不显示下拉框中建议的值怎么解决
不知名人士的博客
03-31 3028
明明按照官方文档的例子稍微改造了一下，但是下拉框中的内容就是出不来，什么问题？？ 解决方法： 这个 value-key 属性的默认值是 value，你的键名不一定是叫value，改成你自己对应的就可以了。 ...
ElementUi el-autocomplete 踩坑 （使用clearable清除,点击输入框下拉条件不再显示）
m0_61083409的博客
03-08 1646
今天在写组件的时候，用到了el-autocomplete来做模糊搜索。因为要可以清除条件，所以加了clearable属性，然后遇到了个bug。点击清除图标后，如果你已经是聚焦状态了，你在点击输入框，下拉框不会再显示了 查了一下，是因为有element-ui源码有bug，主要原因是 参考该博客 autocomplete组件在执行清除事件时，将activated置为false。这时候下拉框不会显示了，而在querySearch执行成功后又没有将activated置为true。所以导致了该bug。解决的核心.
Vue结合element UI组件 el-autocomplete 使用 ，解决根据选择类型来决定输入建议的数据延迟问题
最新发布
yuxuan89814的专栏
07-19 529
element UI组件 el-autocomplete 应用 ，解决根据选择类型来决定输入建议的数据延迟问题
element-ui的el-autocomplete不显示下拉框中的数据
caoyuna1998的博客
05-18 1675
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
el-autocomplete不显示下拉框，选中后还弹出下拉框，手动去掉输入框焦点
weixin_45599105的博客
02-28 790
el-autocomplete不显示下拉框，el-autocomplete选中后还弹出下拉框，el-autocomplete手动去掉输入框焦点
element el-autocomplete数据不显示问题
jam476的专栏
01-29 3581
element el-autocomplete数据不显示问题
el-autocomplete 自定义模板 使用 slot-scoped 下拉数据没有显示
qq_52038997的博客
06-05 880
如果父组件在此插槽中传递了内容，将会被渲染。如果没有，则使用默认内容。按照官方文档写的自定义模板，下拉列表没有展示出来？
详解element-ui中el-select的默认选择项问题
10-16
需要注意的是，如果`v-model`的值不在`el-option`的`value`集合中，`el-select`将不会显示任何选项，因为没有匹配的值。为了避免这种情况，我们需要确保所有可能的默认值都存在于`options`中。 此外，`el-select`...
Vue el-autocomplete远程搜索下拉框并实现自动填充功能(推荐)
10-16
在Element UI中，el-autocomplete是一个提供自动完成输入提示的组件，可进行远程搜索。 #### 2. el-autocomplete组件的使用 el-autocomplete组件在Vue项目中通过简单的模板标签即可嵌入，能够与后端服务器进行交互...
element-ui el-autocomplete设置输入框和下拉框宽度，详细代码
06-07
要设置 `el-autocomplete` 组件的输入框和下拉框的宽度，可以通过以下代码实现： ```html <el-autocomplete v-model="value" :fetch-suggestions="querySearch" placeholder="请输入内容" :style="{width: ...
Element-UI el-autocomplete带输入建议的输入框组件
一碗清深的博客
04-18 671
el-autocomplete 是一个可带输入建议的输入框组件，fetch-suggestions 是一个返回输入建议的方法属性，如 querySearch(queryString, cb)，在该方法中你可以在你的输入建议数据准备好时通过 cb(data) 返回到 el-autocomplete 组件中。
element-ui中select下拉框加载大数据渲染优化
donggua_123的博客
04-27 7229
现在的前端项目中对于element-ui的使用几乎已经是一个常规动作了，但是组件库中的ui组件不一定都能满足实际场景的需求，比如今天要讲的select下拉框选择组件。 我们公司是做证券行业基础设施的，股票和证券的数量动不动就是上千，当使用select渲染的时候就会很有压力，我司大致3000条数据，全部渲染出来大致需要4s左右，并且多选模式时，选中和反选时会明显感觉卡顿，这在体验上是觉得不能接受的...
element 自动搜索 el-autocomplete，不显示结果
扮老虎的猪
09-03 3121
代码： <el-autocomplete style="width: 58%;" v-model="search_text" value-key="address" :fetch-suggestions="search" :trigger-on-focus="false" placeholder="请输入内容" size="small" ></el-autocomplete&
ElementUI下拉框选择后不显示值
qq_41504815的博客
04-09 4198
问题：使用elementUI的下拉选择框，点击后正常赋值，但下拉框不显示内容 <el-select v-model="courseInfo.subjectId" placeholder="二级分类" @change="handleChange"> <el-option v-for="subject in subSubjectList" :key="subject.id" :label="subject.title"
el-autocomplete解决不显示下拉框列表问题
Charonmomo的博客
12-23 2775
如图所示, 控制台中可以看到 results 中已经有了数据, 但是 cb(results) 却不能在网页中显示. 产生原因: element-ui对于返回数据的格式有要求，必须是一个数组对象，并且属性名为“value”，将results中的属性名换成value就可以了. 参考: 添加链接描述 ...
el-autocomplete照抄官网demo都不显示值的原因
测试领域专家，多领域测试技术、管理、工具都略懂，略懂一二
05-27 1060
首先官网的写法： 然后为了验证能不能用，我几乎完全复制它所有的内容了，还是没有加载出来 很多网上说的时数据参数要存在{"value"}值，可demo就是value的值啊，为何还是没有显示，直到我看的这个：element 自动搜索 el-autocomplete，不显示结果_扮老虎的猪的博客-CSDN博客 发现它的方法可用，就能实现。 <el-autocomplete style="width: 58%;" v-model="search_text" value-k
el-autocomplete 的 fetchSuggestions获取到了数据。但是在获取焦点的情况下点击 clearabl 。 清空input 内容后 不显示问题
weixin_49210760的博客
10-31 725
bug
vue element ui中使用el-autocomplete不渲染数据的问题
yuwenwenwenwenyu的博客
12-17 4246
vue element ui中使用el-autocomplete不渲染数据的问题 在项目开发过程中，因为数据量过大，不方便使用select下拉框，于是想到从服务端搜索数据的el-autocomplete，但是在使用的过程中，el-autocomplete一直不能够渲染数据，后来仔细查阅api发现有一个value-key属性可以解决这个问题。 最主要的是要将node-key设置为你显示的字段名，如...
vue el-select 下拉框选择后,不显示
weixin_39891473的博客
12-13 2273
问过度娘后得知, 是因为数据层数太多, render函数没有更新,在select 里添加以下代码。使用forceUpdate手动强制刷新。
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值