vue iview 导出 csv 时数据为空

[taomujian]

使用 iview 导出 csv 表格时,里面数据为空,这是咋回事.

<template>
  <div>
      <Input v-model="keyword" placeholder="搜索关键字" class="input" @keyup.enter.native="handleFilter" />
      <Button @click="handleFilter" class="button" type="primary" icon="ios-search">搜索</Button>
      <Button @click="exportData" class="download-button" type="primary" icon="ios-download-outline">导出数据</Button>
      <Table :show-header="false" :data="tableData" :columns="columns" ref="tables">
        <template slot-scope="{ row }" slot="url">
          <div v-if="row.url" class="div">
           <a target="_blank" :href="row.url" > {{ row.url }}</a>
           <Button @click="doCopy(row.url)" type="info" class="fuzhi" size="small">复制</Button>
          </div>
        </template>
        
      </Table>
      <Page
          class="page"
          :current="this.page.pageNum"
          :page-size="this.page.pageSize"
          :total= "this.page.count"
          :page-size-opts="[10,20,30,50,100]"
          show-sizer
          show-elevator
          show-total
          @on-change="handlePage"
          @on-page-size-change="handlePageSize">
      </Page>
  </div>
</template>

<script>
import RSA from '@/libs/crypto'
import { search } from '@/api/search'
export default {
  inject: ['reload'],
  name: 'SearchIndex',
  data () {
    return {
      token: getToken(),
      keyword: '',
      page: {
        pageNum: 1,
        pageSize: 10,
        count: 0
      },
      columns: [
        {
          slot: 'url',
          align: 'center'
        },
        {
          slot: 'banner'
        }
      ],
      tableData: []
    }
  },
  methods: {
    getTableData () {
      let data = {
        'pagenum': this.page.pageNum,
        'pagesize': this.page.pageSize,
      }
      data = JSON.stringify(data)
      let params = { 'data': RSA.Encrypt(data) }
      search(params).then(response => {
        this.tableData = response.data
        this.page.count = response.total
      })
    },
    exportData () {
      this.$refs.tables.exportCsv({
        filename: `${(new Date()).valueOf()}.csv`
      })
    }
  }
}
</script>

[taomujian]

因为 columns 进行了特殊处理,得再定义一个普通的 columns,然后自定义导出数据就行了