vue中字典的使用

1.引入字典

bash 复制代码
 dicts: ['order_status','product_type'],

2.表单中使用

select下拉

cpp 复制代码
 <el-form-item label="订单状态" prop="orderStatus">
          <el-select v-model="form.orderStatus" clearable placeholder="请输入订单状态" :disabled="isDisable" style="width: 100%" >
            <el-option
              v-for="dict in dict.type.order_status"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>

checkbox

cpp 复制代码
 <el-form-item label="是否正式报价单" prop="isFormal">
          <el-radio-group v-model="form.isFormal">
            <el-radio v-for="dict in  dict.type.yes_or_no" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
          </el-radio-group>
        </el-form-item>

3.列表中使用

cpp 复制代码
 <el-table-column label="订单状态" align="center" prop="orderStatus" >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.order_status" :value="scope.row.orderStatus"/>
        </template>
      </el-table-column>
相关推荐
铁皮饭盒1 小时前
bun直接tsx,优雅!
javascript·后端
Csvn2 小时前
Monorepo 迁移血泪史:从 Multi-Repo 到 Turborepo,这 3 个坑我帮你踩完了
前端
星栈3 小时前
Dioxus 多页面怎么做:`dioxus-router`、嵌套路由、`Outlet` 和页面组织,一篇给你讲顺
前端·rust·前端框架
用户987409238873 小时前
用 Remotion + edge-tts 打造中文教学视频全自动流水线
前端
风骏时光牛马3 小时前
Less前端工程化实战:变量混合器与项目样式分层落地
前端
假如让我当三天老蒯3 小时前
Options API(选项式 API) 和 Composition API(组合式 API)
前端·vue.js·面试
SameX3 小时前
iOS 独立开发实践:用 MapKit + 像素渲染实现 Citywalk 轨迹地图 App「雁过留痕」
前端
_柳青杨3 小时前
一文吃透 Node.js 事件循环:从原理到 Node 20+ 重大变更
javascript·后端
skyey3 小时前
页面加载时,深色模式闪白的问题解决
前端
IT_陈寒3 小时前
Java 并行流把我坑惨了,这6小时加班值了
前端·人工智能·后端