我正在编写一个带有 redux 和 redux-actions 的 ReactJS 应用程序。我想创建一个带有登录详细信息的 redux-action 输入负载，如下所示：
{
type: 'AUTH_REQUEST',
payload: { login: 'Foo', password: 'bar' },
}
...但我所有的尝试都没有成功。
根据文档，应该有一种方法可以在有效负载中添加数据，但我对前端堆栈的精通程度不够，无法真正理解。
这是我到目前为止所拥有的：
动作.js
import { createAction } from 'redux-actions';
export const AUTH_REQUEST = 'AUTH_REQUEST'
export const authRequest = createAction(AUTH_REQUEST);
登录表单容器.js
const mapStateToProps = state => ({
isLoggedIn: state.authentication.isLoggedIn
})
const mapDispatchToProps = dispatch => ({
authRequest: () => dispatch(authRequest())
})
export const LoginFormContainer = connect(
mapStateToProps,
mapDispatchToProps
)(LoginForm)
登录表单.js
constructor(props) {
super(props);
this.state = {
email: '',
password: '',
errors: {email: '', password: ''},
emailValid: false,
passwordValid: false,
formValid: false
};
this.handleEmailChange = this.handleEmailChange.bind(this);
this.handlePasswordChange = this.handlePasswordChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit(event) {
event.preventDefault();
this.props.authRequest();
}
我相信我应该能够在处理提交时提供存储在 loginForm 状态中的电子邮件和密码，但我不知道该怎么做……（是的，我是 js 新手）。任何人都可以帮我解决这个问题吗？
动作.js
const authRequest = createAction(AUTH_REQUEST, (login, password) => ({ login, password }));
登录表单容器.js
const mapDispatchToProps = dispatch => ({
authRequest: (...args) => dispatch(authRequest(...args))
})
登录表单.js
handleSubmit(event) {
event.preventDefault();
const { email, password } = this.state;
this.props.authRequest(email, password);
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句