我创建了带有进度条的初始屏幕。初始屏幕的整个功能是检查用户是否可用,如果可以,它将重定向到“仪表板其他注册”表单。我正在使用redux操作来计算进度条值和登录检查。
这是我的进度栏操作代码:
export const progressBarLevel = () => {
return (dispatch) => {
this.progress = 0;
dispatch({ type: PROGRESS, payload: 0 });
setTimeout(() => {
dispatch({ type: INDETERMINATE, payload: false });
const interval = setInterval(() => {
this.progress += Math.random()/5;
if(this.progress > 1){
this.progress = 1;
clearInterval(interval);
}
return dispatch({ type: PROGRESS, payload: this.progress });
},250)
},500)
}
}
和我的登录Check Action:
export const loginCheck = () => {
return async (dispatch) => {
let token = await AsyncStorage.getItem(LOGIN_TOKEN);
let userUid = await AsyncStorage.getItem(USER_UID);
if(token && userUid) {
dispatch({ type: VALID_LOGIN_AVAILABLE, payload: token });
dispatch({ type: VALID_UID_AVAILABLE, payload: userUid });
}
else {
dispatch({ type: NO_VALID_LOGIN_AVAILABLE, payload: token });
}
}
};
因此,通过使用这些,我可以满足需求。而且我正在使用componentDidMount和willUpdate来执行perfom操作。
我的componentDidMount():
componentDidMount() {
this.props.loginCheck();
this.props.progressBarLevel();
}
我的componentDidUpdate():
componentDidUpdate() {
this.mounted = true;
if(this.props.progressed === 1) {
if(this.props.token === null) {
this.props.navigation.navigate('WelcomeAuth')
}
else {
this.props.navigation.navigate('Dashboard')
}
}
}。
因此,总的来说,一切都正常运行,但是当没有用户可用时。页面被重定向到“ WelcomeAuth”(实际上是正确的)但是,当我输入内容时,它再次重定向到“页面开始”,作为欢迎页面。因此,我应该单击注册按钮并输入下一个单词,然后再次返回“欢迎”页面。
如何停止启动画面组件?由于其工作是重定向多数民众赞成,因此在重定向之后,应卸载初始屏幕,以使其在后台不起作用?
如何实现?
答案 0 :(得分:0)
首先创建一个操作以重置导航状态
const homeAction = StackActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'HomeScreen' })],
});
然后使用分派导航
this.props.navigation.dispatch(homeAction);
此处所有其他组件都将被删除,只有HomeScreen会出现在导航堆栈中