我是 react native 的初学者,我正在开发小应用程序来显示来自 firebase 数据库的提要,如果用户已登录。因此,在调用isloggedin函数后,我正在使用then函数来显示Firebase数据。
这是 my 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
})
}
});
}
};
我正在调用组件DidMount函数中的isLoggedIn函数;
componentDidMount (){
this.props.isLoggedIn()
.then(() => {
this.props.fetchTweet();
});
}
但是我得到这样的错误:未定义不是一个对象(评估"this.props.isLoggedIn().then")我希望从我的代码中显示我的火力基础数据。顺便说一下,fetchTweet 在没有 then 函数的情况下工作,如果我不使用"then",isLoogedin 也可以工作
不起作用,因为this.props.isLoggedIn()
返回一个接受调度对象的函数。此操作将被 redux thunk(中间件)拦截。因此,这不是返回承诺,因此它不可随后返回。它将产生错误。正确的方法是:
componentDidMount (){
// calling only the action creator
this.props.isLoggedIn()
}
侦听化简器中的动作,例如:
// 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注入到组件,然后执行逻辑,然后执行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()
}
}