若依项目中对于字典,前端处理和后端处理的方法复盘汇总

1、前端下拉框使用字典:

<el-col :span="12">
            <el-form-item label="性别" prop="xb">
              <el-select
                v-model="formData.xb"
                placeholder="请选择性别"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.性别字典名"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>

2、表格的值展示字典值

      <el-table-column label="性别" align="center" prop="xb" width="150">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.性别字典名" :value="scope.row.xb" />
        </template>
      </el-table-column>

3、后端其实可以在返回的时候直接调

但注意使用场景是数据仅拿来做页面展示,如若是修改页面调此接口就不适合

可以直接转字典再返给前端:

person.setSex(dictDataService.selectDictLabel("性别字典名", v.getSex()));

4、在SQL里面就关联字典表给转了

FROM 查询主表 aaa
LEFT JOIN 字典表 dd on dd.性别字典名 = aaa.业务code

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值