Redux form is not taking any values

Question

I have been trying to create a new form using redux form. my input form is not taking any value pressed into it.

My code is:

import React, { Component } from "react"
import { Field, reduxForm } from "redux-form"

class BranchForm extends Component {
  textFieldComponent = ({ input }) => {
    console.log(input)
    return <input value={input.value} onChange={input.onChange} />
  }

  render() {
    return (
      <form >
        <Field
          name="Branch"
          label="Enter Branch"
          component={this.textFieldComponent}
        ></Field>
      </form>
    )
  }
}

export default reduxForm({ form: "branchForm" })(BranchForm)

the reducer is taken from the redux form and added to the combine reducer along with other branch reducers:

import { combineReducers } from "redux"
import { reducer as formReducer } from "redux-form"
import branchesReducer from "./branchesReducer"

export default combineReducers({
  branches: branchesReducer,
  forms: formReducer
})

this is my index.js of the whole project, I used dev tools too,

import React from "react"
import ReactDOM from "react-dom"
import Thunk from "redux-thunk"
import { createStore, applyMiddleware, compose } from "redux"
import { Provider } from "react-redux"

import App from "./components/App"
import reducers from "./Reducers"

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose
const store = createStore(reducers, composeEnhancers(applyMiddleware(Thunk)))

const rootElement = document.getElementById("root")
ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  rootElement
)

Answer 1

Thank you for your help people, i made a very silly mistake.

the solution is in the last line of branches form in export default statement I gave forms instead of form while exporting.

Answer 2

The problem is that you do not give any argument to the this.textFieldComponent function. You can try like this

import React, { Component } from "react"
import { Field, reduxForm } from "redux-form"

    class BranchForm extends Component {
      textFieldComponent = ({ input }) => {
        console.log(input)
        return <input value={input.value} onChange={input.onChange} />
      }

      render() {
        const input= {
            value: this.props.value,
            onChange: this.props.onChange
        }
        return (
          <form >
            <Field
              name="Branch"
              label="Enter Branch"
              component={this.textFieldComponent(input)}
            ></Field>
          </form>
        )
      }
    }

    export default reduxForm({ form: "branchForm" })(BranchForm)