javascript - 使用单独的文件 react native 全局对象

Question

我有一个新的 React Native 应用程序，现在所有内容都在一个文件中。以减少技术债务和增加模块化的名义，我想开始将我的几个屏幕组件移动到单独的文件中。问题在于，有一些状态(用户数据)和功能(网络、持久数据)是全局的，并在我的应用程序的各个屏幕上使用。

因此，我无法将屏幕代码移动到单独的文件并在整个应用程序中利用全局状态:

var globalState = {
  val: "Default",
}

class HomeScreen extends React.Component {
  render() {
    return (
      <View></View>
    )
  }
  someFunction = () => {
    Alert.alert(globalState.val);
  }
}

class LoginScreen extends React.Component {
  render() {
    return (
      <View></View>
    )
  }

  someFunction = () => {
    globalState.val = "Something";
  }
}

基本上，我想从两个屏幕访问 globalState，但将它们放在单独的文件中。我希望每个屏幕共享 globalState 对象，以便一个屏幕可以更新信息并让另一个屏幕访问该信息。

我想在不使用 Redux 等任何其他库的情况下解决这个问题。

Answer 1

您需要使用 Redux 或 Mobx 等全局状态管理解决方案，或者使用 React 的 Context api 或 useContext hook 等。