React Native：更新数据后未重新渲染组件

Question

我有两个屏幕，一个显示个人资料信息，另一个屏幕用于编辑信息。如果我输入第一个屏幕配置文件，它会向我显示来自数据库的正确数据。然后我移动到下一个屏幕，我可以在其中更改迄今为止工作的信息。但如果我回到前一个屏幕，我仍然会看到旧数据。所以没有重新渲染。

但是，如果我导航到另一个屏幕，该屏幕会获取新数据。并调用 getCurrentUserProfile 被执行

这是显示用户个人资料信息的屏幕。

const ProfileScreen = props => {

  const [userObj, setUserObj] = useState({});

  useEffect(() => {
    let mounted = true;
    getCurrentUserProfile().then(user => {
      if (mounted) {
        setUserObj(user);
      }
      console.log(user)
    });
    return () => mounted = false;
  }, []);

  console.log("----b------") // This is only output on the first call
}

我该如何解决这个问题。有没有办法在数据库中发生更改时，让组件重新渲染并获取新数据。

谢谢。

Answer 1

您可能正在使用@react-navigation 包。因此，如果您想在返回上一页时重新获取数据，您可以在“上一页”上使用https://reactnavigation.org/docs/use-is-focused。

看看他们的文档，你就会明白了。

P.S: 通常我们不会直接卸载组件。在 React Native 中，我们使用 navigator 来挂载/卸载组件