使用map 解决cube.js 默认title 显示的问题
默认cube client sdk 提供了比较完整的处理展示，但是因为titile 比较长，或者就不是我们应该显示的，造成一些问题
参考解决方法
使用map 进行以下数据转换就可以了
const columns = resultSet.tableColumns().map((item)=>{
return {
...item,
title:item.shortTitle,
shortTitle:item.title
}
})
参考antd table 数据绑定
import React from 'react';
import { Table } from 'antd';
import { useCubeQuery } from '@cubejs-client/react';
import cubejs from '@cubejs-client/core';
import 'antd/dist/antd.css';
const cubejsApi = cubejs('<token>', {
apiUrl: '<addd>',
});
function Demo() {
const { resultSet, isLoading, error, progress } = useCubeQuery(
{"measures": ["HrSeaApproveStatistics.count"],
"timeDimensions": [],
"order": { "HrSeaApproveStatistics.count": "desc" },
"dimensions": ["HrSeaApproveStatistics.avg_order_id"]
},{
cubejsApi
});
if (isLoading) {
return <div>{progress && progress.stage && progress.stage.stage || 'Loading...'}</div>;
}
if (error) {
return <div>{error.toString()}</div>;
}
if (!resultSet) {
return null;
}
function demoapp(item){
return item["shortTitle"]
}
const dataSource = resultSet.tablePivot();
// 通过map进行简单转换
const columns = resultSet.tableColumns().map((item)=>{
return {
...item,
title:item.shortTitle,
shortTitle:item.title
}
})
console.log(columns)
return <div >
<Table columns={columns} dataSource={dataSource} />;
</div>
}
// Create Document Component
export default Demo;
