我可以将 wix/react-native-navigation 创建的根组件包装在 ApolloProvider 组件中吗

Posted 2023-03-08

【中文标题】我可以将 wix/react-native-navigation 创建的根组件包装在 ApolloProvider 组件中吗

【英文标题】：Can I wrap the root component created by wix/react-native-navigation in an ApolloProvider component

【发布时间】：2017-02-25 02:39:24

【问题描述】：

我将 Meteor 的 Apollo 客户端与 wix/react-native-navigation 结合使用，我想知道是否可以将 Navigation.startSingleScreenApp 创建的根组件包装在 ApolloProvider 组件中？我尝试将Navigation.startSingleScreenApp 放在另一个组件的渲染方法中，并将其包含在ApolloProvider 中，但这不起作用。有没有人有过将这两者结合使用的经验？

我想知道在Navigation.registerComponent 注册的每个组件是否都有自己单独的根组件，如果是这种情况，我必须将我在ApolloProvider 注册的每个组件都附上，可能使用更高阶的组件？我将不胜感激任何人可以提供的任何想法或示例代码！提前致谢。

【参考方案1】：

我已经使用高阶组件来包装每个已注册的组件。我用于 HOC 的代码如下：

import React from 'react';
import appClient  from '../store/apollo';
import  ApolloProvider  from 'react-apollo';

export default function apolloProviderHOC(WrappedComponent)
  return class PP extends React.Component 
    render() 
      return (
        <ApolloProvider client=appClient>
          <WrappedComponent ...this.props/>
        </ApolloProvider>
      );
    
  

只需导入上面的函数，然后将要包装的组件传递进去即可。

【参考方案2】：

我为这个问题找到的最简单的解决方案是像这样在 registerComponent 函数中简单地传递 ApolloClient ：

Navigation.registerComponent('pm.SplashScreen', () => SplashScreen, store, Provider, client);

必须将 ApolloClient 称为“客户端”，因为 react-native-navigation 在您传递的那个对象上使用了传播运算符。