小编The*_*ser的帖子

如何在Apollo GraphQL查询返回后更新Redux存储

我正在graphql通过react apollo提供的HOC 获取数据列表.例如:

const fetchList = graphql(
  dataListQuery, {
    options: ({ listId }) => ({
      variables: {
        listId,
      },
    }),
    props: ({ data: { loading, dataList } }) => {
      return {
        loading,
        list: dataList,
      };
    }
  }
);
Run Code Online (Sandbox Code Playgroud)

我在受控的单选按钮组中显示列表,我需要默认选择其中一个项目.在id所选择的项目被保留在终极版商店.

那么,问题是如何selectedItem在查询成功返回后更新Redux存储(即设置)?

我想到了一些选择:

选项1

我应该APOLLO_QUERY_RESULT在Redux减速机上听动作吗?但这有点尴尬,因为那时我需要听两个APOLLO_QUERY_RESULT,APOLLO_QUERY_RESULT_CLIENT如果查询已经运行过.同时,也是operationName道具只在本APOLLO_QUERY_RESULT行动而不是APOLLO_QUERY_RESULT_CLIENT采取行动.因此,我需要剖析每一个APOLLO_QUERY_RESULT_CLIENT动作,以了解它的来源.是否有一种简单直接的方法来识别查询结果操作?

选项2

我应该发送一个单独的动作SELECT_LIST_ITEM,componentWillReceiveProps例如(使用重构):

const enhance = compose(
  connect(
    function mapStateToProps(state) { …
Run Code Online (Sandbox Code Playgroud)

reactjs apollostack react-apollo apollo-client

23
推荐指数
1
解决办法
2127
查看次数