有关 search 的值问题

来源：5-32 方案落地：剩余问题处理

johnny_2008

2022-07-19

老师您好，
搜索框不管选哪个，最后搜索框显示的结果都是最后一个选项，下拉显示的选项全是默认高亮，我在提问区出看到了之前有同学也遇到和我一样的问题，还请老师再重新看下这个问题吧，在老师提供的线上项目地址也存在同样的问题!
图片描述

我尝试解决发现在 el-select 组件显示的值有问题，但不清楚要怎么解决：
此处我选择的是 用户>用户管理选择，选择后显示的是 用户>Excel导入
图片描述

我认为问题大概是

	:key="option.item.path"
    :value="option.item"

尝试把 value 改为 option.item.path 就正常了，但 element api 的说明，value的可以为 string / number / boolean / object ，请老师指教

在搜索框输入用户随便选一个选项，之后就能看到问题了

老师请看动图
图片描述

写回答

3回答

南京烧饼

2022-12-30

你这个问题我也遇到了，我的解决方式是在选中回调时加上search.value的显示，这样选中的时候就是显示的正确的值了

const onSelectChange = (val) => {

router.push(val.path)

search.value = val.title.join(' > ')

}

weixin_慕先生4557099

2022-11-02

Select 选择器#
基础用法#
适用广泛的基础单选 v-model 的值为当前被选中的 el-option 的 value 属性值

我看文档里面有写v-model的值是option的值，所以应该不是placeholder的问题，是要在关闭搜索框时清空每一次v-model的值，search.value = ''

Sunday

2022-07-19

你好

你这里其实是有两个问题：

options 高亮的问题。其实这个问题对功能并没有影响，它只是一个样式而已，如果说你不希望存在高亮（options 上的 selected 类），那么可以 el-option 的 :value 属性值修改为 option.item.path 。但是如果这样修改的话，不要忘记在 onSelectChange 中把代码修改为 router.push(val) 。
以下为修改后的代码截图：