建设管理平台

SuitDictCascader 多级字典级联器

suit-dict-cascader是一个基于el-cascader的用于多级字典级联选择的组件。

# 基本用法

<template>
  <suit-dict-cascader
    v-model="value"
    :code="dictCode"
    placeholder="请选择字典"
    @change="handleChange"
  ></suit-dict-cascader>
</template>

<script>
export default {
  data() {
    return {
      value: [],
      dictCode:'root1'
    }
  },
  methods: {
    handleChange(value) {
      console.log(value);
    },
  },
};
</script>
Expand Copy

# 属性

属性 说明 类型 默认值
code 多级字典编码 string -
options 可选项数据源，格式参考示例 array []
value 选中项的值，可以使用 v-model 双向绑定 array []
placeholder 选择框默认文字 string 请选择
disabled 是否禁用 boolean false
clearable 是否可以清空选项 boolean false
change-on-select 是否允许选择任意一级的选项 boolean false
filterable 是否可搜索选项 boolean false
size 输入框尺寸，可选值为large、medium、small、mini string medium
popper-class 自定义浮层类名 string -
expand-trigger 次级菜单的展开方式，可选值为click或hover string click
show-all-levels 输入框中显示选中值的完整路径，而不只是最后一级 boolean false
debounce 搜索关键词输入的去抖延迟，毫秒 number 300
before-filter 自定义搜索函数，入参为输入的关键词和选项数据，返回布尔值 function -
popper-append-to-body 是否将弹出菜单插入至 body 元素。在弹出菜单的定位出现问题时，可尝试修改该属性 boolean true

# 事件

事件名称 说明 回调参数
change 当绑定值变化时触发的事件 选中的值
visible-change 下拉框出现/隐藏时触发的事件 出现则为 true，隐藏则为 false
remove-tag 移除Tag时触发的事件 移除的Tag值
clear 点击清空按钮时触发的事件 -
blur 当组件失去焦点时触发的事件 (event: Event)

SuitDialog 弹框