更改tabledata列名

最新推荐文章于 2023-12-28 20:00:12 发布

一只小奶狗

最新推荐文章于 2023-12-28 20:00:12 发布

阅读量255

点赞数

分类专栏： vue 文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/qq_43362481/article/details/125132744

版权

vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<template>
  <el-container>
    <el-aside>

    </el-aside>
    <el-header>
      <el-row :gutter="20">
        <el-col :span="3">
          <el-input v-model="input1"></el-input>
        </el-col>
        <el-col :span="3">
          <el-input v-model="input1"></el-input>
        </el-col>
        <el-col :span="3">
          <el-input v-model="input1"></el-input>
        </el-col>
        <el-col :span="2">
          <el-button type="primary">查询</el-button>
        </el-col>
        <el-col :span="2">
          <el-button type="primary" @click="exportData">导出</el-button>
        </el-col>
      </el-row>
    </el-header>
    <el-table
        :data="tableData"
        style="width: 50%">
      <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>
    <el-main>

    </el-main>
  </el-container>
</template>

<script>
export default {
  name: "testPage",

  data() {
    return {
      input1: '',
      tableData: [{
        date: '2016-05-02',
        name: '王小虎1',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '王小虎2',
        address: '上海市普陀区金沙江路 1517 弄'
      }, {
        date: '2016-05-01',
        name: '王小虎3',
        address: '上海市普陀区金沙江路 1519 弄'
      }, {
        date: '2016-05-03',
        name: '王小虎4',
        address: '上海市普陀区金沙江路 1516 弄'
      }],


      ripColumns: [
        {fedNam: 'name', fedRmk: '姓名'},
        {fedNam: 'address', fedRmk: '地址'},
        {fedNam: 'date', fedRmk: '日期'},
      ],
    }
  },
  methods: {
    exportData() {
      this.trans();
    },
    trans() {
      let res = [];
      this.tableData.forEach(dat=>{
        let obj = {};
        this.ripColumns.forEach(col =>{
          obj[col['fedRmk']] = dat[col['fedNam']];
        })
        res.push(obj);
      })
      console.log(res)
    }

  }
}
</script>

<style scoped>

</style>