使用iview的exportcsv怎样导出嵌套数据

Question

使用iview的Table组件导出CSV文件

<template>
<div>
    <Table :data="data" :columns="columns" ref="dataTable" />
    <button @click="exportData">导出数据</button>
    </div>
</template>

<script>
export default {
    data(){
        return {
            data:[
                {id:1,name:'名称1',category:{id:21,name:'类别21'}},
                {id:2,name:'名称2',category:{id:21,name:'类别21'}},
                {id:3,name:'名称3',category:{id:22,name:'类别22'}},
            ],
            columns:[
                {title:'名称',key:'name'},
                {title:'类别',key:'category',render:(createEl,params)=>
                createEl("span",params.row.category.name)},
            ]
        }
    },
    methods:{
        exportData(){
            this.$refs.dataTable.exportCsv({
                filename:'test_export',
                columns:this.columns,
                data:this.data
            })
        }
    }
}

上面代码，网页能正常显示数据：

名称	类别
名称1	类别21
名称2	类别21
名称3	类别22

但点击 导出数据 按钮后，导出的数据是这样的：

名称	类别
名称1	[object Object]
名称2	[object Object]
名称3	[object Object]

---

这种嵌套的数据正常的导出姿势是什么？求大神指导！！

Answer 1

理论来说只要把data里面object字段转成你要显示的内容字符串即可

exportData() {
  this.$refs.dataTable.exportCsv({
    filename: 'test_export',
    columns: this.columns,
    data: this.data.map(v => ({...v, category: v.category.name})),
  });
},

没用过这个框架，代码未实测