目前做了一个组件,用el-select远程搜索邮箱,并允许自定义邮箱
如下图所示:
图中除了a 其余的都是我从数据库查出来的
现在有如下需求
当输入的数据在数据库查不到时候
后面显示(自定义)等数据
以上图为例
图中的option 选项中就应该显示为:
a(自定义)
目前做了一个组件,用el-select远程搜索邮箱,并允许自定义邮箱
如下图所示:
图中除了a 其余的都是我从数据库查出来的
现在有如下需求
当输入的数据在数据库查不到时候
后面显示(自定义)等数据
以上图为例
图中的option 选项中就应该显示为:
a(自定义)
代码如下:
<el-select
style="width:100%"
v-model="postData.mailReceiver"
multiple
clearable
@clear="clearMailReceiverStorage"
:loading="loading"
allow-create
filterable
remote
default-first-option
placeholder="请输入邮箱地址"
:remote-method="remoteSearchMail"
>
<el-option v-for="item in options" :key="item.id" :label="item.email" :value="item.email"></el-option>
</el-select>
经实验检测 allow-create 创建的数据并不是concat到 从后端查询返回的数据中
10 回答11.1k 阅读
5 回答4.8k 阅读✓ 已解决
4 回答3.1k 阅读✓ 已解决
2 回答2.6k 阅读✓ 已解决
3 回答5.1k 阅读✓ 已解决
3 回答1.8k 阅读✓ 已解决
2 回答4.7k 阅读✓ 已解决
贴下代码是最好的了。
一个办法是你可以使用计算属性来计算出select的选项,假设搜索得到的列表是list, 关键字是keyword, 在list前面加上这个a:
另一个方法是在el-option上做判断,判断为前端添加的数据则加上自定义。