
使用 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> 1 taomujian OP 因为 columns 进行了特殊处理,得再定义一个普通的 columns,然后自定义导出数据就行了 |