Graphql 调用 Axios 多次调用 Performance/Refactoring

Question

我可以在我的 JSON 文件中删除和添加数据，但是如果我一直按下按钮（切换 add/delete），我会遇到网络故障。我假设我不能像这样发出多个请求？

const handleSave = save => {
  if (save.toLowerCase() === 'save') {
    props
      .addSaved({
        variables: {
          id: props.id,
        },
      })
      .then(res => {
        setSaved('Unsave');
        setSavedPropData(res.data.addSaved);
      });
  } else {
    props
      .deleteSaved({
        variables: {
          id: savedPropData.id,
        },
      })
      .then(() => setSaved('Save'));
  }
};

以上是我手柄保存数据的片段。所以每次按下它都会切换保存或取消保存，然后它会在我的 JSON 中添加或删除数据。我目前正在使用 json 服务器来测试应用程序。

const savedMutate = gql`
  mutation addSaved($id: String) {
    addSaved(id: $id) {
      id
    }
  }
`;

const deletedMutate = gql`
  mutation deleteSaved($id: String) {
    deleteSaved(id: $id) {
      id
    }
  }
`;

export default _.flowRight(
  graphql(savedMutate, {name: 'addSaved'}),
  graphql(deletedMutate, {name: 'deleteSaved'}),
)(withNavigation(Card));

如果我将应用程序部署到生产环境中，是否有更好的方法来执行此操作？目前我在快速切换时遇到网络故障。我刚刚又试了一次，是不是因为我的应用程序每次都刷新，并且在刷新时，我正在尝试保存到我的数据库中，但它还没有完全安装？这只发生在开发中吗？

突变：

addSaved: {
  type: SavedType,
  args: {
    id: {type: GraphQLString},
  },
  resolve(parentValue, {id}) {
    return axios
      .post(`http://localhost:3000/saved`, {id})
      .then(res => res.data);
  },
},
deleteSaved: {
  type: SavedType,
  args: {
    id: {type: GraphQLString}
  },
  resolve(parentValue, {id}) {
    return axios
      .delete(`http://localhost:3000/saved/${id}`)
      .then(res => res.data);
  },
},

Answer 1

如果您运行使用 nodemon 的服务器并且您正在写入某个文件以响应请求并且该文件正在被 nodemon 监视，那么您的请求将始终触发服务器重启。由于第一个请求会重新启动服务器，紧随其后的任何请求都将失败，因为您的服务器在重新启动时会关闭。

你需要configure nodemon to ignore the appropriate files or directories。这样，对文件的任何更改都不会导致 nodemon 重新启动您的服务器。

Graphql 调用 Axios 多次调用 Performance/Refactoring

Graphql Calling Axios Multiple Calls Performance/Refactoring

refactoring

apollo

reactjs

graphql

react-native