JSearchSelectTag - xinwu-yang/cube-vue GitHub Wiki

JSearchSelectTag 字典选择(可搜索)组件

一个下拉搜索组件,支持异步加载,异步加载用于大数据量的字典表。

代码演示

<template>
  <a-form>
    <a-form-item label="下拉搜索" style="width: 300px">
      <j-search-select-tag placeholder="请做出你的选择" :dictOptions="dictOptions" v-model="selectValue"> </j-search-select-tag>
      {{ selectValue }}
    </a-form-item>

    <a-form-item label="异步加载" style="width: 300px">
      <j-search-select-tag placeholder="请做出你的选择" dict="sys_depart,depart_name,id" :async="true" v-model="asyncSelectValue"> </j-search-select-tag>
      {{ asyncSelectValue }}
    </a-form-item>
  </a-form>
</template>
<script>
  export default {
    data() {
      return {
        selectValue: '',
        asyncSelectValue: '',
        dictOptions: [
          {
            text: '选项一',
            value: '1'
          },
          {
            text: '选项二',
            value: '2'
          },
          {
            text: '选项三',
            value: '3'
          }
        ]
      }
    }
  }
</script>

api

props

属性 说明 类型 必填 默认值
value(v-model) string | number
placeholder 默认文字 string '请选择'
dict 表名,显示字段名,存储字段名 拼接而成的字符串 string
dictOptions 选项,未设置 dict 时使用 array
async 是否异步,如果是,通过输入的内容加载远程数据,否则在本地过滤数据 boolean false

事件

事件名称 说明 回调参数
change 值变化时调用 function(value)
⚠️ **GitHub.com Fallback** ⚠️