如何在应用程序加载后触发API调用

Question

我正在使用堆栈React/Redux/Redux-observable/Redux-router。

我希望根据rest api获取有关当前用户的信息(如果未登录，则触发重定向到身份验证门户)，以便在启动应用程序时显示适当的屏幕。

我找不到任何合适的方法来做到这一点，因为我的问题是我不知道何时/在哪里触发这些操作。

Answer 1

我将给你一个redux的例子，因为我不熟悉观察点。

您可以在根组件的componentDidMount生命周期方法中调度检索用户信息的操作，并根据接收到的内容呈现适当的UI部分。

或者，您可以始终呈现路由器，并根据您为getUserInfo接收到的内容在中间件中分派适当的导航操作。

class Root extends React.Component {
  componentDidMount() {
    this.props.getUserInfo();
  }

  render() {
    return (
      {this.props.userLoggedIn ? <LoggedInUI /> : <LoginPage />}
    );
  }
}

const mapStateToProps = state => ({
  userLoggedIn: state.user.loggedIn,
});

const mapDispatchToProps = {
  getUserInfo,
};

export default connect(mapStateToProps, mapDispatchToProps)(Root);