JDictSelectUtil.js 列表字典函数用法

  • 第一步: 引入依赖方法
import {initDictOptions, filterDictText} from '@/components/dict/JDictSelectUtil'

  

  • 第二步: 在created()初始化方法执行字典配置方法
  //初始化字典配置
      this.initDictConfig();

  

  • 第三步: 实现initDictConfig方法,加载列表所需要的字典(列表上有多个字典项,就执行多次initDictOptions方法)
      initDictConfig() {
        //初始化字典 - 性别
        initDictOptions('sex').then((res) => {
          if (res.success) {
            this.sexDictOptions = res.result;
          }
        });
      },

  

  • 第四步: 实现字段的customRender方法
     customRender: (text, record, index) => {
       //字典值替换通用方法
       return filterDictText(this.sexDictOptions, text);
     }

  

  • 第五步: 实现字段的条件筛选方法
<j-dict-select-tag  v-model="queryParam.sex" placeholder="请输入用户性别"
                  dictCode="sex"/>

  

  • 第六步: modal的条件筛选方法
<j-dict-select-tag  v-decorator="['sex', {}]" :triggerChange="true" placeholder="请输入用户性别"
                  dictCode="sex"/>

  

原文地址:https://www.cnblogs.com/cerofang/p/13666607.html