javascript - React Native - Undefined 不是对象(评估 this.props.isLoggedIn.then)

Question

我是 React Native 的初学者，我正在开发一个小应用程序来显示来自 firebase 数据库的提要，如果用户已登录。所以在调用 isloggedin 函数后，我正在使用 then 函数来显示 firebase 数据。

这是我的 isLoggedIn 函数:

export const isLoggedIn = () => {
  return dispatch => {
    firebase.auth().onAuthStateChanged(user => {
      if(user){
          Actions.main();
          dispatch({
              type:LOGGED_IN
          })
      }else {
          Actions.auth();
          dispatch({
              type:NOT_LOGGED_IN
          })
      }
    });
  }
};

我在 componentDidMount 函数中调用 isLoggedIn 函数；

componentDidMount (){
    this.props.isLoggedIn()
        .then(() => {
            this.props.fetchTweet();
        });
}

但我收到这样的错误:undefined is not an object (evaluating 'this.props.isLoggedIn().then')我希望我的代码显示我的 firebase 数据。顺便说一句，fetchTweet 在没有 then 函数的情况下也能工作，如果我不使用“then”，isLoogedin 也能工作

Answer 1

这将不起作用，因为 this.props.isLoggedIn() 返回一个接受调度对象的函数。此操作将被 redux thunk(中间件)拦截。因此这不是返回一个 promise ，所以它不是thennable。它会产生错误。正确的方法是:

componentDidMount (){
    // calling only the action creator
    this.props.isLoggedIn()
}

在 reducer 中监听 Action，例如:

// Typical reducer
function(state = INITIAL_STATE, action) {
 switch(action.type) {
   case LOGGED_IN : 
    // change your state according to the business logic
    // for example make a flag IsLoggedIn and make it true
     const changed_state =  // Your changed state
     return changed_state
   default:
     return state;
 }

将状态从 mapStateToProps 注入(inject)到组件，然后执行逻辑，然后执行 this.props.fetchTweet()。

// Implementing mapStateToProps function
 const mapStateToProps = function(state) {
   // get the key from the state
   const loginSuccess = state.IsLoggedIn
   return {
        loginSuccess
        }

componentWilReceiveProps(nextProps) {
if(nextProps.loginSuccess && this.props.loginSuccess !== nextProps.loginSuccess) {
 this.props.fetchTweet()
}
}