js中filter处理后端返回表格数据

javascript 复制代码
<template>
  <div>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
      :formatter="tranForm"
        prop="gender"
        label="性别"
        width="180">
      </el-table-column>
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
      data() {
        return {
          optionData:[
              {value:'1',label:'男'},
              {value:'0',label:'女'}
          ],
          tableData: [{
            gender:'0',
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
             gender:'0',
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
          }, {
             gender:'1',
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
             gender:'1',
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }]
        }
      },
      methods: {
        //主要代码
        tranForm(row,column,cellValue){
          let gender=''
          this.optionData.filter(item=>{
            if(item.value==cellValue){
              gender=item.label
            }
          })
          return gender || cellValue
        }
      }
}
</script>

<style scoped>

</style>
相关推荐
Swift社区2 小时前
在 Swift 中实现字符串分割问题:以字典中的单词构造句子
开发语言·ios·swift
new出一个对象2 小时前
uniapp接入BMapGL百度地图
javascript·百度·uni-app
没头脑的ht2 小时前
Swift内存访问冲突
开发语言·ios·swift
没头脑的ht2 小时前
Swift闭包的本质
开发语言·ios·swift
wjs20242 小时前
Swift 数组
开发语言
你挚爱的强哥3 小时前
✅✅✅【Vue.js】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本
javascript·vue.js·jquery
stm 学习ing3 小时前
FPGA 第十讲 避免latch的产生
c语言·开发语言·单片机·嵌入式硬件·fpga开发·fpga
前端Hardy4 小时前
纯HTML&CSS实现3D旋转地球
前端·javascript·css·3d·html
susu10830189114 小时前
vue3中父div设置display flex,2个子div重叠
前端·javascript·vue.js
湫ccc4 小时前
《Python基础》之字符串格式化输出
开发语言·python