如何在其包装组件之外重新获取查询?

atk*_*yla 6 apollo apollostack react-apollo

我有两个屏幕:

屏幕 1:结果

屏幕 2:编辑过滤器

当我在 Screen2 上编辑过滤器并按回时,我想重新获取 Screen1 上的查询(使用新构建的过滤器字符串变量)。编辑过滤器不使用突变或触发任何 Redux 操作(我将用户搜索过滤器/首选项存储在 localStorage/AsyncStorage 而不是数据库中,因此没有突变)。我只是更改表单的本地状态并使用它来构建我想传递给 Screen1 上的某个查询的过滤器字符串。如果有帮助,我可以访问两个屏幕上的过滤器字符串。

似乎refetch()仅限于其查询包装的组件http://dev.apollodata.com/react/receiving-updates.html#Refetch那么我将如何从不同的屏幕重新运行查询?

我尝试在 Screen1 和 Screen2 上放置相同的查询,然后在 Screen2 上调用 refetch,尽管查询有效并在 Screen2 上获取新数据,但我实际需要的 Screen1 上的同名查询并未更新。如果他们有相同的名字,不是应该的吗?(但过滤器变量改变了)

在此处输入图片说明

如果我只是错误地设计了这个并且有更简单的方法来做到这一点,请告诉我。我希望如果我有 2 个屏幕,在它们两个上放置相同的查询,并使用新的过滤器变量重新获取其中一个查询,那么重新获取应该在两个地方发生,但它目前正在单独处理它们。

Bru*_*eis 1

我在这里也做了同样的事情。场景: - 我选择一个对等点来过滤一些消息。- 我将peerId保留在redux中 - 我使两个组件(过滤器和列表)都依赖于该redux值。

像这样:

1 - 将该过滤器值放在 redux 上(并将其夺回):

import { compose, graphql } from 'react-apollo'
import { connect } from 'react-redux';
...
export default compose(
    connect(
        (state,ownProps) => ({ 
            selectedMessages: state.messages.selectedMessages,
            peerId: state.messages.peerId
        }),
        (dispatch) => ({
            clearSelection: () => dispatch(clearSelection()),
            setPeer: (peerId) => dispatch(setPeer(peerId))
        })
    ),
    graphql(
        PEERS_QUERY,
...
Run Code Online (Sandbox Code Playgroud)

当您首先调用 connect (使用 compose)时,在调用 graphql 包装器之前或在该包装器之外,您将在 graphql 包装器上将 peerId 作为 prop 使用,因此您可以使用它来过滤您的查询:

export default compose(
    connect(
        (state,ownProps) => { 
            return {
                peerId: state.messages.peerId,
                selectedMessages: state.messages.selectedMessages
            }
        },
        (dispatch) => ({
            toggleMessage(messageId) {
                dispatch(toggleMessage(messageId));
            }
        })
    ),
    graphql( // peerId is available here because this is wrapped by connect
        MESSAGES_QUERY,
        {
            options: ({peerId}) => ({variables:{peerId:peerId}}),
            skip: (ownProps) => ownProps.peerId === '',
            props: ({
            ...
        ...
    ...
)(MessageList);
Run Code Online (Sandbox Code Playgroud)