javascript - You must either pass handleSubmit() an onSubmit function or pass onSubmit as a prop | Redux Forms -


i want create simple form takes in email adress , later adds our database. went react forms, because facilitates whole development process , reduces amount of time.

however, when i'm trying post form i'm getting error: uncaught error: must either pass handlesubmit() onsubmit function or pass onsubmit prop

here's adduserform.js:

import react 'react' import { field, reduxform } 'redux-form'  const adduserform = ({ handlesubmit }) => {   return (     <form onsubmit={handlesubmit}>       <div>         <field name="email" component="input" type="email" />       </div>       <button type="submit">bjud in</button>     </form>   ) } export default reduxform({   form: 'adduser' })(adduserform) 

here's adduseraction:

import axios 'axios' import settings '../settings'  axios.defaults.baseurl = settings.hostname  export const adduser = email => {   return dispatch => {     return axios.post('/invite', { email: email }).then(response => {       console.log(response)     })   } } 

and here's addusercontainer.js:

import react, { component } 'react' import { adduser } '../../actions/adduseraction' import adduserform './views/adduserform' import { connect } 'react-redux'  class addusercontainer extends component {   submit(values) {     console.log(values)     this.props.adduser(values)   }    render() {     return (       <div>         <h1>bjud in användare</h1>         <adduserform onsubmit={this.submit.bind(this)} />       </div>     )   } }  function mapstatetoprops(state) {   return { user: state.user } }  export default connect(mapstatetoprops, { adduser })(addusercontainer) 

i grateful answers! stay awesome!

not 100% problem recommend against trying bind on form or whatever. assuming you're storing input in state's user object, want define submit method, , call this.state.user. method should call api method.

import react, { component } 'react' import { adduser } '../../actions/adduseraction' import adduserform './views/adduserform' import { connect } 'react-redux'  class addusercontainer extends component {   submit(values) {     console.log(values)     this.props.adduser(values)   }    render() {     return (       <div>         <h1>bjud in användare</h1>         <adduserform onsubmit={this.submit(this.state.user)} />       </div>     )   } }  function mapstatetoprops(state) {   return { user: state.user } }  export default connect(mapstatetoprops, { adduser })(addusercontainer) 

Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -