Apollo GraphQL（React）跨组件共享数据

我刚开始使用react apollo，想知道什么是跨组件共享数据的最佳方式

例如，我有

componentA

，它使用

react apollo

中的

grapql

来获取一些数据（

WrappedA

）。我的UI中还有一些其他组件，

componentB

，我想使用

componentA

已经获取的数据。 下面附上一个非常简单的例子

const ComponentA = ({ ...props }) => (
    <div>
        ComponentA...
        id: {props.organisationsData.organisations.id}
    </div>
)

const ComponentB = ({ ...props }) => (
    <div>
    ****** Want to access props.organisationsData *****
    ComponentB...
    </div>
)

const organisationsQuery = gql`
    query organisations {
        organisations {
            id
            name
        }
    }
`

const WrappedA = graphql(organisationsQuery, { name: 'organisationsData' })(WrappedA)

const Container = ({ ...props }) => (
    <div>
        <WrappedA />
        <ComponentB />
    </div>
)

（省略

name

）我看到了对graphql端点的额外调用。 这并不理想

访问已从服务器获取的数据的最佳方式是什么？（由于使用v2，因此无法使用现有的redux存储，手动访问缓存的级别似乎较低，站点上未提及此用例：）

---

谢谢。

您可以使用apollo链接，这是本地状态管理，您可以阅读文档

阿波罗链接状态允许您将本地数据与远程数据一起存储在阿波罗缓存中。要访问本地数据，只需使用GraphQL查询即可。您甚至可以在同一查询中请求本地和服务器数据

---

主UI组件不需要查询，但这两个A/B组件都需要查询。因此，将其与主UI组件进行合并是没有意义的。由于该组件不需要任何东西。

const WrappedB = graphql(gql`
    query organisations {
        organisations {
            id
        }
    }
`, { name: 'organisationsData' })(WrappedB)