一、新增字典

系统管理-->字典管理-->新增

 

新增字典中的内容

二、若依下拉框如何绑定字典

2.1、前台文本框中使用字典项

<el-table-column label="任务组名" align="center" prop="jobGroup">
     <template slot-scope="scope">
         <dict-tag :options="dict.type.sys_job_group" :value="scope.row.jobGroup"/>
     </template>
</el-table-column>

见红色部分文字。

引入方式vue2和vue3略有不同。

vue2中：dicts: ['sys_job_group', 'sys_job_status'],

vue3中：

const { proxy } = getCurrentInstance() as any;

const {
 sys_user_id_type, //证件类型
 sys_political_status, //政治面貌
 sys_user_sex, //  性别
 sys_qualification, // 学历
 sys_duty_type, // 职务名称
 sys_stations_type, //岗位类别
 sys_personel, //人员分类
} = proxy.useDict(
 "sys_user_id_type",
 "sys_political_status",
 "sys_user_sex",
 "sys_qualification",
 "sys_duty_type",
 "sys_stations_type",
 "sys_personel",
);

2.2、前台下拉框使用字典项

<label>申请状态：</label>
    <!--下拉框绑定字典-->
    <!--${}:声明局部变量-->
    <!--${@dict.getType('字典类型')}-->
    <select name="state" th:with="state=${@dict.getType('application_state')}">
       <option value="">请选择</option>
       <!--${dict.dictLabel}:字典标签-->
       <!--${dict.dictValue}:字典键值-->
       <option th:each="dict : ${state}" 
               th:text="${dict.dictLabel}" 
               th:value="${dict.dictValue}"></option>
 </select>

三、若依表格如何将字典键值显示为对应的字典标签

在实体类上注解@Excel中添加属性dictType="字典类型"

 

四、若依后端如何根据字典键值获取对应的字典标签

@Autowired
private DictDataServiceImpl dictDataService;

DictData dictData = new DictData();
dictData.setDictValue("字典值");
dictData.setDictType("字典类型");
dictDataService.selectDictLabel(dictData);//记得提前将dictDataService引入