加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

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

发布时间:2020-12-15 09:35:39 所属栏目:百科 来源:网络整理
导读:我有两个屏幕: 屏幕1:结果 Screen2:编辑过滤器 当我在Screen2上编辑过滤器并按回来时,我想在Screen1上重新获取查询(使用新构建的过滤器字符串变量).编辑过滤器不会使用突变或触发任何Redux操作(我将用户搜索过滤器/首选项存储在localStorage / AsyncStora
我有两个屏幕:

屏幕1:结果

Screen2:编辑过滤器

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

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

我尝试在Screen1和Screen2上放置相同的查询,然后在Screen2上调用refetch,虽然查询工作并在Screen2上获取新数据,但同样的名称查询不会在我实际需要它的Screen1上更新.如果他们有相同的名字,是不是应该这样? (但过滤器变量已更改)

enter image description here

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

解决方法

我在这做了同样的事情.场景:
? – 我选择一个对等体来过滤一些消息.
? – 我将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,...

当你首先调用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);

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读