如何从另一个组件重新获取graphql查询?

时间:2019-12-05 21:24:47

标签: reactjs graphql apollo react-apollo

我是React的新手,尤其是graphql。

每次尝试使用createEvent变异时,我都尝试重新获取事件查询,因此我的所有事件页面都会自动更新,不需要刷新。

但是,我找不到连接这两个查询的方法。

“ form.jsx”文件中的我的变异createEvent:

  const body = {
    query:
      "mutation{" +
      "createEvent(eventInput:{num1:" +
      '"' +
      this.state.num1.toString() +
      '"' +
      ",num2:" +
      '"' +
      this.state.num2.toString() +
      '"' +
      "}){" +
      "_id " +
      "num1 " +
      "num2 " +
      "addition " +
      "multiply" +
      "}}"
  };
  fetch("https://localhost:8000/graphql", {
    method: "POST",
    body: JSON.stringify(body),
    headers: {
      "Content-Type": "application/json"
    }
  })
    .then(res => {
      if (res.status !== 200 && res.status !== 201) {
        throw new Error("Failed!");
      }
      return res.json();
    })
    .then(resData => {
      console.log(resData);
    })
    .catch(err => {
      console.log(err);
    });

这是来自“ myTable.jsx”文件的事件查询:

const body = {
  query:
    "query {" +
    "events {" +
    "_id " +
    "num1 " +
    "num2 " +
    "addition " +
    "multiply" +
    "}}"
};
//console.log(body);
fetch("https://localhost:8000/graphql", {
  method: "POST",
  body: JSON.stringify(body),
  headers: {
    "Content-Type": "application/json"
  }
})
  .then(res => {
    if (res.status !== 200 && res.status !== 201) {
      throw new Error("Failed!");
    }
    return res.json();
  })
  .then(resData => {
    const events = resData.data.events;
    this.setState({ list: events });
  })
  .catch(err => {
    console.log(err);
  });

我在Promise'then'功能中尝试了refetchQueries函数,但是崩溃了。

1 个答案:

答案 0 :(得分:0)

我从querys.js文件中导出了查询,然后启用了使用ApolloClient的refetch选项。