RemoteSelect

封装接口请求的 Select,此组件一般用于数据量少、搜索条件单一的场景下使用,其他场景请封使用搜索帮助组件来实现。

基础用法

格式化 options 类型

插槽使用

变更之前的回调

自定义添加 options

多选

格式化 Label

禁用 Option

接口请求之后的格式化

Label 模式

RemoteSelect API

RemoteSelect Attributes

名称说明类型默认值必填
modelValue值Number, String, Boolean—是
label-keylabel 使用的 keyString Arraylabel—
value-keyvalue 使用的 keyStringvalue—
label-mode是否开启 label 只读模式,默认跟随全局控制Boolean——
http请求的实例String—是
url接口请求 URL,所有接口都是 post 请求String—是
param接口请求参数Object——
method请求接口方式Stringpost—
append-list自定义添加到 options 中的数据Array——
is-storage是否本地缓存接口数据(sessionStorage)Booleanfalse—
format-option-type强制格式化服务器返回的 options 的类型String''—
label-separator当label-key为 Array 类型时可使用此属性来分隔数据String—
before-change数据变更之前的回调,需要通过返回 Boolean 或者 Promise 对象来指定数据是否可修改,回调参数:(newVal,oldVal)Function——
disabled-optionsoptions 不可用的列表Array——
hidden-options需要隐藏 options 列表Array——
back-up-value当有些场景下拉值中没有选中时,且还需要显示对应的 label 内容时,可使用此属性,需要注意的是:label-mode 为 true,此属性才可用any——
is-clear-by-option-null当下拉 options 没有值时,是否清空 value 内容Booleanfalse—
after-request接口请求之后的回调,需要返回一个 list,组件可通过此 list 来格式化数据Function——

RemoteSelect Events

名称说明类型
change下拉变更Function
done数据加载完成回调Function
blur下拉失去焦点Function

RemoteSelect Exposes

方法名说明类型
getOptionsList获取下拉选项中的数据Function

RemoteSelect Slots

插槽名说明
append输入框后置内容
labelModeValue只读模式的展示插槽