代码之家 › 专栏 › 技术社区 › Chris Geirman

如何将盖茨比混合站点连接到Apollo/Graphcool(或Redux)?

graphcool gatsby react-apollo react-redux redux

3

Chris Geirman · 技术社区 · 7 年前

我陷入了第一步,添加了一个apollo提供商,将站点连接到Graphcool。

通常,我会在根上这样做,应用程序是我网站的根。。。

const networkInterface = createNetworkInterface({
  uri: GRAPHCOOL_SIMPLE_ENDPOINT
});

const client = new ApolloClient({
  networkInterface
});

export default ReactDOM.render(
  <ApolloProvider client={client}>
    <App />
  </ApolloProvider>,
  document.getElementById('root')
);

但是这个网站的根在盖茨比网站的哪里呢?

2 回复 | 直到 7 年前

1

3

dobleUber 7 年前

您想做一些类似于Redux示例站点的事情

https://github.com/gatsbyjs/gatsby/blob/master/examples/using-redux/gatsby-browser.js

您需要注意的一件事是,在使用Graph.cool中的数据之前,始终检查您是否在客户端中。如果您在静态渲染的组件中工作,则不能期望图形。在服务器和客户端上呈现组件时可用的冷数据。

2

0

Alvis 7 年前

componentDidMount 生命周期法。例如

class Index extends React.Component<IndexPageProps> {
  public componentDidMount(): void {
    ReactDOM.render(<App />, document.getElementById('root'));
  }

  public render(): JSX.Element {
    return (
      <div>
        <div id="root" />
      </div>
    );
  }
}