함수는 React-Router 내부의 함수가 아닙니다.

Question

저는 웹 사이트에 간단한 양식을 만듭니다. 하지만 약간 문제가 있습니다. 내가 로그인과 암호를 서버로 전송하려고 입력하면

내가 오류

Uncaught TypeError: this.props.signinUser is not a function

import React, { Component } from 'react'; 
import { Field, reduxForm } from 'redux-form'; 
import * as actions from '../../actions'; 

class Signin extends Component{ 

constructor(props){ 
super(props); 
this.state= {}; 
this.onSubmit = this.onSubmit.bind(this); 
} 

renderField(field){ 
    return(
    <div className="form-group"> 
     <label>{field.label}</label> 
     <input 
      className="form-control" 
      type="text" 
      {...field.input} 
      /> 

    </div> 
    ); 
} 

onSubmit(e){ 
    e.preventDefault(); 
    let {login,password} = this.state; 
    //this.props.login(login,password); 
    console.log({login,password}); 
    this.props.signinUser({login,password}); 
    this.setState({ 
     login: '', 
     password: '' 
    }) 
} 




render(){ 
    let {login,password} = this.state; 


    return(
     <form onSubmit={this.onSubmit}> 

      <Field 
       label="Login:" 
       name="login" 
       component={this.renderField} 
       onChange={e => this.setState({login: e.target.value})} 
      /> 
      <Field 
       label="Password:" 
       name="password" 
       component={this.renderField} 
       onChange={e => this.setState({password: e.target.value})} 
      /> 
      <button action="submit" className="btn btn-primary"> Sign In </button> 
     </form> 

    ); 
} 
} 


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

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

과 행동을 얻었다.

import axios from 'axios'; 


export function signinUser({login,password}){ 
return function(dispatch){ 

    axios.post('http://localhost:8080/auth', { login, password}); 

}; 

} 

및 최종적으로 환원제.

import { combineReducers } from 'redux'; 
import { reducer as fromReducer } from 'redux-form'; 

const rootReducer = combineReducers({ 
form: fromReducer 
}); 


export default rootReducer; 

반응식 16, 반응식 v5와 반응기 v3, 반응식 v7!

ReactForm의 연결 기능에 문제가 있다고 생각합니다!

Answer 1

문제는이

import { connect } from 'react-redux'; 
import { bindActionCreators } from 'redux'; 
.... 
//remainder of the code 
.... 
mapDispatchToProps =(dispatch)=>{ 
return { 
    actions : bindActionCreators(actions , dispatch) 
}; 
} 
Signin= connect(
    mapStateToProps, 
    mapDispatchToProps 
)(Signin); 

export default reduxForm({ 
    form: 'signin' 
    })(Signin); 

당신은 전화 변경해야해야 여기

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

있다 this.props.signinUserthis.props.actions.signinUser에 더 많은 정보에서 : https://redux-form.com/7.0.4/docs/faq/howtoconnect.md/