首页 > 解决方案 > 使用 CubeJs 从数据库中获取实时数据

问题描述

我正在cubejs使用React. 我想显示实时数据。

我尝试使用 React 生命周期方法和状态,其中<QueryRender>组件每 2 秒触发一次。但它不起作用。

标签: reactjscube.js

解决方案


您可以将传输切换到 Web 套接字:

import cubejs from '@cubejs-client/core';
import WebSocketTransport from '@cubejs-client/ws-transport';

const cubejsApi = cubejs({
  transport: new WebSocketTransport({ authentication: CUBEJS_TOKEN, apiUrl: 'ws://localhost:4000/' })
});

并使用 react hooks 订阅:

import { useCubeQuery } from '@cubejs-client/react';

const Chart = ({ query }) => {
  const { resultSet, error, isLoading } = useCubeQuery(query, { subscribe: true });

  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <pre>{error.toString()}</pre>;
  }

  return <LineChart resultSet={resultSet}/>;
};

要了解更多信息:https ://cube.dev/docs/real-time-data-fetch


推荐阅读