el-table-column表格匹配字典数据

根据字典值匹配 列的值 优点就是可维护性强 改完字典就会生效 如果写死需求变更难以维护

javascript 复制代码
<el-table v-loading="loading" :data="processList" @selection-change="handleSelectionChange">
 
   <el-table-column type="selection" width="55" align="center" />
 
      <!--类型匹配转换-->
      <el-table-column label="类型" align="center" prop="type">
           <template slot-scope="scope">
              {{getChangeType(scope.row.type)}}<!--调用getChangeType方法-->
           </template>
      </el-table-column>
 
</el-table>
javascript 复制代码
 getChangeType(e) {
      for (var i = 0; i < this.typeList.length; i++) {
        if (this.typeList[i].value == e) { //value,label保持和上面定义一致
          return this.typeList[i].label;
        }
      }
    },

typeList是你从字典getdict获取的数组 根据对应的value 匹配对应的label

相关推荐
pan_junbiao2 分钟前
Whistle 抓包工具的安装与使用
前端·测试工具·压力测试·抓包
Cory.眼9 分钟前
前端调用后端接口全流程实战
前端·调用接口
牛栓柱15 分钟前
【后端实战】用 Supabase + React/TS 零成本构建高并发 Multi-Agent 服务
前端·数据库·人工智能·后端·react.js·前端框架
木斯佳18 分钟前
前端八股文面经大全:百度-Agent部门-前端一面(2026-06-04)·面经深度解析
前端
shmily麻瓜小菜鸡18 分钟前
Bootstrap 4 常用工具类速查表
前端·javascript·bootstrap
CDN36020 分钟前
【架构进阶】告别配置漂移!用 NodeNext + Workspace 打造优雅的 TypeScript Monorepo
前端·javascript·typescript
协享科技26 分钟前
前端 SSE 流式响应处理实践:从接收、解析到渲染
前端·人工智能·程序人生·go·ai编程·sse
超人不会飞_Jay33 分钟前
6.2前端笔记
前端·javascript·笔记
鹏大师运维35 分钟前
统信UOS安装Subtitle Edit并使用Edge-TTS生成AI语音教程
linux·前端·人工智能·edge·麒麟·统信uos·ai语音
程序员小羊!41 分钟前
02CSS预备知识
前端·css3