Question

的src /动作/ index.js

blobContainerName

的src /组件/ AUTH

import axios from 'axios';
const ROOT_URL = "http://localhost:3090";

export function signinUser({ email, password }){
    return function(dispatch){
        axios.post(`${ROOT_URL}/signin`, { email, password });
        console.log("hey");
    }
}

我正在使用Redux表单进行签名。这是我点击“登录”时出现的错误。按钮。也许signinUser（）函数没有正确定义。

bundle.js：29019 Uncaught TypeError：this.props.signinUser不是函数（...）

Answer 1

如果有人碰到它（我现在在Udemy上做同样的啧啧），这是redux-form 5.x和6之间的一个重大变化。基本上，你只需要通过reduxForm运行它， connect，如此评论中所示https://github.com/erikras/redux-form/issues/1050#issuecomment-221721848。

最终结果如下：

Sigin = reduxForm({ form: 'sigin', fields: [ 'email', 'password' ] })(Sigin);
export default connect(null, actions)(Sigin);

Answer 2

您可以查看我的github repo，了解您使用v1.5.0的redux-form here成功实现的相同问题。这是基于Stephen Grider的Advanced React和Redux Udemy课程。如果你喜欢它，请为它加注星标。

关于您当前的问题：

Redux Form v6实现了一个稍微不同的逻辑。而不是fieldset您使用Field并将其与reduxForm一起导入：

import { reduxForm, Field } from 'redux-form';

由于新版本没有内置的连接方法，您需要：

import { connect } from 'react-redux';

在您的特定实例中，您的其余代码应重构如下：

const renderInput = field => {
    const { input, type } = field;
    return (
        <div>
            <input {...input} type={type} className="form-control" />
        </div>
    );
}

class Signin extends Component {
    handleFormSubmit({ email, password }) {    
        this.props.signinUser({ email, password });
    }

    render(){
        const { handleSubmit } = this.props;

        return (
            <form onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}>

                <div className="form-group">
                    <label>Email:</label>
                    <Field name="email" 
                        type="email" component={renderInput} />
                </div>
                <div className="form-group">
                    <label>Password:</label>
                    <Field name="password" 
                        type="password" component={renderInput} />
                </div>
                <button action="submit" className="btn btn-primary">Sign in</button>
            </form>
        );
    }
}

function mapStateToProps(state) {
    return { form: state.form };
}

Signin = connect(mapStateToProps, actions)(Signin);
Signin = reduxForm({
 form: 'signin'
})(Signin);
export default Signin;

在Redux Form migration guide中，您将看到允许您保持更新的正确新语法。

Answer 3

尝试使用actions.signinUser({ email, password });

Answer 4

将您的redux-form依赖关系更改为5.3.3版

未捕获的TypeError：this.props.signinUser不是函数（...）

4 个答案: