JSelectDepart - xinwu-yang/cube-vue GitHub Wiki

JSelectDepart 部门选择组件

一个选择部门组件，存储部门 ID，显示部门名称。点击输入框后，弹窗中选择部门。

代码演示

<template>
  <a-form :form="form">
    <a-form-item label="部门选择v-decorator" style="width: 300px">
      <j-select-depart v-decorator="['bumen']" />
      {{ getFormFieldValue('bumen') }}
    </a-form-item>

    <a-form-item label="部门选择v-model" style="width: 300px">
      <j-select-depart v-model="bumen" />
      {{ bumen }}
    </a-form-item>

    <a-form-item label="部门多选v-model" style="width: 300px">
      <j-select-depart v-model="bumens" :multi="true" />
      {{ bumens }}
    </a-form-item>
  </a-form>
</template>
<script>
  export default {
    data() {
      return {
        form: this.$form.createForm(this),
        bumen: '',
        bumens: ''
      }
    },

    methods: {
      getFormFieldValue(field) {
        return this.form.getFieldValue(field)
      }
    }
  }
</script>

api

props

属性 说明 类型 必填 默认值
value(v-model) 值 string
modalWidth 弹窗宽度 number 500
multi 是否多选 boolean false
rootOpened 是否展开根节点 boolean true
disabled 是否禁用 boolean false
customReturnField 自定义返回字段 string 'id'
placeholder 占位符 string 请点击选择部门
isMyDepart 是否只展示自己的部门 boolean false

事件

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