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

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

graphcool gatsby react-apollo react-redux redux

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 年前

dobleUber 7 年前

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

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

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

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>
    );
  }
}

推荐文章

zuZuu · React Redux-无法设置未定义的属性(设置“value”)

2 年前

universe11 · 对伊默来说,这是正确的还是错误的?

3 年前

Huy282002 · 将redux toolkit与JS一起使用时,不能跳过在CreateSicle()中键入状态

3 年前

Mistakamikaze · React Redux |在全局Redux状态之前更新本地状态

3 年前

Kiv Daor · 当某些项具有未知值时,排序数组无法正常工作

3 年前

Chong Lip Phang · 不变性检查中间件在Redux工具包中做什么?

3 年前

geyser · React Redux toolkit-输入字段的状态管理

3 年前

Avishay Matayev · 正在获取redux的connect HOC的包装组件类型,以便与React一起使用。在不重新导入的情况下重新创建对象

3 年前

Hamed Ezati · 为什么项目会附加到redux而不是替换?

3 年前

Arash jahan bakhshan · redux未使用React 18重新呈现组件

3 年前