Question

所以我正在做一个使用Axios和Json-server的项目，但我有一个问题，每次我做Patch时，我都要给F5它要更新的主页，我想知道如何做到这一点，以便它不会发生，并自动。

我的Patch：

＆＃13;

  onSubmitDate = event => {
    const newUrl = prompt("Please with new URL:");
    const personCurrent = event.target.value;
    axios.patch(`http://localhost:3004/employee/${personCurrent}`, {
    url_git: newUrl
  })
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.log(error);
  });
}

＆＃13;

我的Get：

＆＃13;

  componentDidMount() {
    axios
      .get("http://127.0.0.1:3004/employee")
      .then(response => this.setState({ employee: response.data }));
  }

＆＃13;

有人可以帮助我吗？

Answer 1

我假设更新是在您正在处理的组件上。

要创建组件的重新渲染，您只需设置状态即可。 See more here 您的回复格式是什么？它是否包含您希望显示的更新数据？如果是这种情况，那么只需在setState中then进行操作即可轻松完成：

  onSubmitDate = event => {
    const newUrl = prompt("Please with new URL:");
    const personCurrent = event.target.value;
    axios.patch(`http://localhost:3004/employee/${personCurrent}`, {
    url_git: newUrl
  })
  .then(response => {
    console.log(response);
    this.setState({employee: response.data})
  })
  .catch(error => {
    console.log(error);
  });
}

如果响应没有在组件中提供您想要更新的数据，那么您可以简单地在PATCH的then中对所需数据进行GET，并在其响应上设置状态。所以像这样：

  onSubmitDate = event => {
    const newUrl = prompt("Please with new URL:");
    const personCurrent = event.target.value;
    axios.patch(`http://localhost:3004/employee/${personCurrent}`, {
    url_git: newUrl
  })
  .then(response => {
    console.log(response);        
    axios.get("http://127.0.0.1:3004/employee")
      .then(response => this.setState({ employee: response.data }));

  })
  .catch(error => {
    console.log(error);
  });
}

如何在致电Axios成功后更新页面？应对

1 个答案: