Javascript 在Thunk和actions完成后,如何使用redux的当前状态?
在Thunk和actions完成后,如何使用redux的当前状态?问题出在handleSubmit函数中。如果我注册了一个有错误的用户,它会用消息“Email ready registered”更新redux的状态,但是当访问dispatch promise中的状态时,会向我发送一个错误的状态,而没有消息 函数hanldesmitJavascript 在Thunk和actions完成后,如何使用redux的当前状态?,javascript,reactjs,redux,redux-thunk,Javascript,Reactjs,Redux,Redux Thunk,在Thunk和actions完成后,如何使用redux的当前状态?问题出在handleSubmit函数中。如果我注册了一个有错误的用户,它会用消息“Email ready registered”更新redux的状态,但是当访问dispatch promise中的状态时,会向我发送一个错误的状态,而没有消息 函数hanldesmit const handleSubmit = (e) => { e.preventDefault() const form = {
const handleSubmit = (e) => {
e.preventDefault()
const form = {
name: e.target[0].value,
email: e.target[1].value,
password: e.target[2].value,
confirmPassword: e.target[3].value
}
const { name, email, password } = form
if (isFormValid(form)) {
//TODO: FIX IT synchronize redux with errors
dispatch( startRegisterUser(name, email, password) ).then(() => {
console.log(state)
})
}
}
注册操作和thunk
export const startRegisterUser = (name, email, password) => {
return (dispatch, state) => {
dispatch(startLoadingAction())
return firebase.auth().createUserWithEmailAndPassword(email, password)
.then(async ({ user }) => {
await user.updateProfile({
displayName: name,
photoURL: ''
})
dispatch(registerUserAction(user.uid, user.displayName))
})
.catch(e => {
if (e.code === "auth/email-already-in-use") {
dispatch(errorAction("Email already registered"))
} else {
dispatch(errorAction("Unexpected error"))
}
})
.then(() => {
dispatch(finishLoadingAction())
console.log("finished dispatch's", state())
return
})
}
}
export const registerUserAction = (uid, displayname) => {
return {
type: types.register,
payload: {
uid,
displayname
}
}
}
控制台日志
我想在handlesubmit函数中获取第一个控制台日志的状态
您应该在reducer中处理
errorAction
,用错误消息更新ui
store切片。并且,您需要在thunk函数的promise中返回状态()。然后,您将在handleSubmit
事件处理程序中获得整个状态
例如
输出:
handleSubmit state: { ui: { error: 'Email already registered' } }
handleSubmit state: { ui: { error: 'Email already registered' } }