el-selecet 实现动态搜索、下拉选项颜色自定义、回车选择下一项

1.实现动态搜索

使用el-selecet 的远程搜索,需要将filterableremote设置为true,同时传入一个remote-method

具体使用直接看https://element.eleme.cn/#/zh-CN/component/select


   

参数使用对照:

el-selecet 实现动态搜索、下拉选项颜色自定义、回车选择下一项_第1张图片

2.下拉框选项颜色自定义

el-selecet 实现动态搜索、下拉选项颜色自定义、回车选择下一项_第2张图片

 

注意:popper-append-to-body属性是Element-UI官方文档中提供的一个属性,该属性的用途就是将el-select选项的内容移动div#app当中,默认值是true

popper-append-to-body为true是设置样式失效需要将他设为false

3.回车

下拉框回车需要加native,否则失效

@keyup.enter.native="keyEnter"

自动获取焦点,失去焦点

this.$refs.sizeSelect.blur();//当前的下拉框
this.$refs.inputQuantity.focus();//下一个下拉框

你可能感兴趣的:(前端专题,elementui,vue.js,前端)