我不知道这里发生了什么。我制作了2个屏幕的简单应用程序,登录成功后,我想更改主页上的屏幕。我正在使用带有react-native的redux,redux-saga和axios
我在登录屏幕上的提交功能是:
home_team_chr
登录成功后,在async submit() {
if(this.state.email.length == 0 || this.state.password.length == 0) {
alert("Filed is required")
} else {
if(typeof this.state.email !== 'undefined') {
if(!this.state.email.match(/[^@]+@[^.]+\..+/)) {
alert("E-mail format wrong!")
} else {
console.log('ok auth');
let user = {
email: this.state.email,
password: this.state.password
}
this.props.login(user)
}
}
}
}
中登录传奇故事编写令牌,并且工作正常
AsyncStorage
成功登录后,reducer返回令牌i export function* loginUser(action) {
const response = yield call(login_api, action.payload)
if(!response || !response.data) {
console.log('wrong login 1: ', response);
//status 422 Unprocessable Entity
return yield put(login_failure('Internal server error for login user'))
}
if(response.status === 200) {
deviceStorage.saveItem('token', response.data.token)
return yield put(login_success(response.data, response.data.token))
} else {
console.log('wrong login 2');
return yield put(login_failure('Error for login user'))
}
}
,然后我要在HomePage中重定向。我想在用户每次进入登录页面时注销它,因为我使用componentDidMount()
Login.js
async componentDidMount() {
await deviceStorage.deleteToken('token')
}
componentWillReceiveProps(nextProps) {
console.log('enxtProps: ', nextProps.token.length);
if(nextProps.token.length > 0) {
//TOKEN EXISTS!!! length = 365
this.props.navigation.navigate('HomePage')
} else {
console.log('Error login');
}
this.setState({
token: nextProps.token
})
}
中的 this.props.navigation.navigate('HomePage')
不会在componentWillReceiveProps
上重定向。
有人可以告诉我为什么吗?
答案 0 :(得分:0)
对于您的代码,我有几点建议。
deviceStorage.saveItem('token', response.data.token)
更改为
yield deviceStorage.saveItem('token', response.data.token)
componentDidUpdate(prevProps) {
// Typical usage (don't forget to compare props)
if (this.props.token !== prevProps.token && this.props.token.length > 0) {
this.props.navigation.navigate('HomePage')
} else {
console.log('Error login');
}
}