首页 > Web开发 > 详细

使用map 解决cube.js 默认title 显示的问题

时间:2021-04-29 09:43:16      阅读:39      评论:0      收藏:0      [点我收藏+]

默认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;
 
 

使用map 解决cube.js 默认title 显示的问题

原文:https://www.cnblogs.com/rongfengliang/p/14716053.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!