javascript - 突变后的 GraphQL refetchQueries，this.props 未更新

Question

这个问题对我来说毫无意义......我正在使用这样的突变将作者添加到数据库中:

this.props
      .addAuthorMutation({
        variables: {
          name: this.state.name,
          age: this.state.age
        },
        refetchQueries: [
          {
            query: getAuthorsQuery,
            variables: {
              awaitRefetchQueries: true
            }
          }
        ]
      })
      .then(() => this.submitBookAlso());

然后简单的...

  submitBookAlso() {
    console.log(this);
    console.log(this.props);
  }

出于某种神秘原因，当我在控制台中检查 (this) 时，this.props.getAuthorsQuery.authors 包含我添加的作者，但是，控制台中的 (this.props) 没有。新作者已成功添加到另一个组件的下拉列表中，并且在数据库中，但我似乎无法在突变后获得作者。我想过滤它...

let author = this.props.getAuthorsQuery.authors.filter(
  author => this.state.name === author.name
);
console.log(author);

...但这只是给了我一个空数组。我想要做的是在完成另一个突变时触发另一个突变(将一本书添加到单独的数据库集合中，新添加的作者作为作者)。

我在不使用 awaitRefetchQueries 的情况下得到相同的结果，并且还使用 onCompleted 而不是 .then()。这些是我当前的依赖项:

  "dependencies": {
    "apollo-boost": "^0.1.16",
    "graphql": "^14.0.2",
    "react": "^16.5.2",
    "react-apollo": "^2.2.4",
    "react-dom": "^16.5.2",
    "react-scripts": "2.0.3"
  },

谢谢!

Answer 1

尝试将 awaitRefetchQueries 直接传递给突变，而不是像这样嵌套在 refetchQueries 中:

this.props
      .addAuthorMutation({
        variables: {
          name: this.state.name,
          age: this.state.age
        },
        awaitRefetchQueries: true,
        refetchQueries: [
          {
            query: getAuthorsQuery
          }
        ]
      })
      .then(() => this.submitBookAlso());