- 
                Notifications
    You must be signed in to change notification settings 
- Fork 0
JSelectDepart
        xinwu-yang edited this page Mar 1, 2023 
        ·
        1 revision
      
    一个选择部门组件,存储部门 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>| 属性 | 说明 | 类型 | 必填 | 默认值 | 
|---|---|---|---|---|
| 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) |