Javascript React Router--历史推送状态不使用新状态对象刷新

当Promise.all解析并保存新活动时，应将用户路由到

/activities

以查看其新创建的活动。一切正常，但我当前需要在路由后刷新

/activities

页面（一次），以便查看表中的新活动

  const handleSaveActivity = e => {
    e.preventDefault();
    Promise.all([
      addActivity(),
      saveActivity()
    ]).then(() => {
      props.history.push('/activities');
    })
  };

我不确定在推送新的历史状态后如何自动重新呈现页面，因此用户不需要手动刷新页面来查看新状态。如果我遗漏了一些重要的内容，我很乐意提供更多的代码片段。

只是为了运行这个。setState（{whateverKey:whateverValue}）？

在您的活动页面（称之为活动组件）中，您应该在每次浏览器点击此组件URL时调用API来获取更新的数据

对于基于类的样式，您应该在

componentDidMount

lifecyclehook中完成

class Activities extends Component {
  // ...
  componentDidMount() { loadActivities() }
  // ...
}

对于基于函数的样式，您应该在

useffect

hook中执行

import React, { useEffect } from 'react'

const Activities = () => {
  useEffect(() => { loadActivities() });
}

---

嗨，我回答这个问题一定有点晚了，但这个问题可能是由于错误使用useEffect造成的，例如，如果您有一个待办事项列表，并且您想使用axios获取数据，它将如下所示：

useEffect(()=>{
    axios.get(`${YOUR_URL}/todos`)
      .then((res)=>{
        setTodos(todos=res.data)
      })
  },[])

useEffect(()=>{
    axios.get(`${YOUR_URL}/todos`)
      .then((res)=>{
        setTodos(todos=res.data)
      })
  })

现在，正如您所看到的，我们有一个空数组的初始值，所以这是作为一个ComponentDidMount，您可能想要的是在它获得一个新值后重新呈现该组件，所以您想要有一个ComponentDidUpdate效果，所以您不需要将该值初始化为空数组，因此它看起来是这样的：

useEffect(()=>{
    axios.get(`${YOUR_URL}/todos`)
      .then((res)=>{
        setTodos(todos=res.data)
      })
  },[])

useEffect(()=>{
    axios.get(`${YOUR_URL}/todos`)
      .then((res)=>{
        setTodos(todos=res.data)
      })
  })

---

希望这对某人有所帮助，因为我是因为同一个问题而来到这里的，并以这种方式来解决问题。

请使用此软件包，它解决了问题。

您需要在活动组件上显示代码，因为这就是问题所在。请为任何链接添加上下文，以便您的答案是独立的，这意味着答案必须在答案本身中。看见如果你能在这里用自己的话回答这个问题，并且只作为参考链接，那就更好了。它是如何工作的？请说明它是如何解决这个问题的。