对于我的一生,我无法弄清楚。它显示的一切无止境地旋转着,我对生命周期的发生顺序感到困惑。基本上,它可以登录或进入主屏幕,并且可以在模拟器上正常运行,但不能在真实设备上运行。我正在使用React 16.8.6和React-native 0.60.5环境。
我正在开始使用RN,调试工具也不是很好。但就目前而言,仅使用Alert即可查看,并且从未达到应该重定向到登录/主屏幕的逻辑。显示的警报按以下顺序:
BS
mount2
render
mount1
我的代码如下:如果令牌存在,请加载主屏幕。其他我想实现的是“加载身份验证”屏幕,但目前为止:
this.props.navigation.navigate(!goToLogin ? 'App' : 'Auth');
从未达到,所以旋转很多。有帮助吗?
import React, {Component} from 'react';
import {StatusBar, View, Alert} from 'react-native';
import {
getUserToken,
loggedInToAssociation,
extractToken,
} from '../shared/loggedinUser';
import {setLanguage} from '../shared/localization';
import {appOptions} from '../config';
import Spinner from '../components/Spinner';
export default class AuthLoadingScreen extends Component {
constructor() {
super();
this.state = {
languageLoaded: false
};
}
componentDidMount() {
Alert.alert("mount1","oumnt1") // shown
loggedInToAssociation()
.then(details => {
// details is an array now
setLanguage(details['language']);
this.setState({languageLoaded: true});
Alert.alert("mount2","oumnt2") // SHOWN
})
.catch(err => {
setLanguage(appOptions.defaultLanguage);
this.setState({languageLoaded: true});
Alert.alert("mount3","oumnt3")
});
}
// Fetch the token from storage then navigate to our appropriate place
_bootstrapAsync = async () => {
const userToken = await getUserToken();
Alert.alert("bs","bs") // SHOWN
const tokenInfo = extractToken(userToken, 'both');
let goToLogin = true; // force user to go to the login page
if (tokenInfo.length == 2) {
goToLogin = false;
}
Alert.alert("bs2","bs2") // NEVER SHOWN
this.props.navigation.navigate(!goToLogin ? 'App' : 'Auth');
};
// Render any loading content that you like here
render() {
if (this.state.languageLoaded){
this._bootstrapAsync().then(s=>{
console.log(s)
}).catch(e=>{
console.log(e)
})
}
return (
<View>
<Spinner />
<StatusBar barStyle="default" />
</View>
);
}
}
答案 0 :(得分:1)
在设备上运行时是否检查了调试控制台?可能会有未处理的承诺拒绝。承诺没有兑现,但是无处可去(在这种情况下,请考虑尝试捕获的情况)。
此方法可能有问题。
extractToken(userToken, 'both')