reactjs - React Hooks 从 react-redux 更新 props
问题描述
我在使用 Redux 更新道具时遇到问题。我正在使用 redux-promise-middleware,并且正在发出登录请求。我的钩子接收到初始状态。当我 console.log 在 mapStateToProps 函数中时,我可以看到调度和减速器正在正确更新。但是,道具永远不会用 redux 更新。
const Login = (props) => {
const [email, updateEmail] = useState('')
const [password, updatePassword] = useState('')
const [firstName, updateFirstName] = useState('')
const [lastName, updateLastName] = useState('')
const [loginToggle, updateLoginToggle] = useState(true)
async function handleLogin() {
const loginInfo = {email, password}
await props.loginUser(loginInfo)
if (props.user.loggedIn) props.history.push('/dashboard');
}
return (
<div className="login-page">
<div className="login-register-container">
{ loginToggle ?(
<div className="login-container">
<h2>Login</h2>
<input placeholder='Email' value={email} onChange={e =>
updateEmail(e.target.value)} />
<input placeholder='Password' value={password} onChange={e => updatePassword(e.target.value)} />
<button onClick={handleLogin}> Login </button>
<p style={{cursor:"pointer"}} onClick={() => updateLoginToggle(false)}> need to register?</p>
</div>
):(
<div className="register-container">
<h2>Register</h2>
<input placeholder='First Name' value={firstName} onChange={e => updateFirstName(e.target.value)} />
<input placeholder='Last Name' value={lastName} onChange={e => updateLastName(e.target.value)} />
<input placeholder='Email' value={email} onChange={e => updateEmail(e.target.value)} />
<input placeholder='Password' value={password} onChange={e => updatePassword(e.target.value)} />
<button onClick={handleRegister}> Register </button>
<p style={{cursor:"pointer"}} onClick={() => updateLoginToggle(true)}> already have login?</p>
</div>
)}
</div>
</div>
)
}
function mapStateToProps(reduxState) {
console.log(reduxState)
return {
user: reduxState.user
}
};
export default connect(mapStateToProps, {loginUser, getUser})(Login)
解决方案
推荐阅读
- python - 套接字连接的范围是什么?
- css - 如何总是在下面堆叠一个伪元素?
- firebase - 使用 Firebase / GCP 像 Google 帐户一样实施跨项目用户身份验证(单点登录)
- bash - Bash:如何对具有特定扩展名的文件使用“查找”,但它也会给出其先前的目录
- selenium - SyntaxError:无法对“文档”执行“评估”:字符串“xpath”不是有效的 XPath 表达式
- python - 关闭 QWebEngineView 警告“已请求发布配置文件,但 WebEnginePage 仍未删除。期待麻烦!”
- php - 为什么 API 不接受我的 XML API 请求?
- python - 每次我发送消息时,我的不和谐机器人都会不断发送垃圾邮件
- python - Plotly:如何将变量分配给子情节标题?
- python - Python - 根据第二个数据帧的长度选择字符串