My input only accepts one character at a time. And it is repeating the same text to other Input

[courtlanda]

I can only enter the input by placing one character at a time. and the same value that I put in one, is repeated for the other inputs.

I've tried several alternatives to handleChange and so on, but nothing's good.

I need a light, please!

class Move2 extends Component {
  constructor(props) {
    super(props);
    this.state = {
      amount: "",
      code: "",
      option: "Entrada"
    };
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }
handleSubmit = e => {

e.preventDefault();

this.props.updateProduct(this.state);

};

handleChange = e => {

this.setState({

[e.target.name]:

e.target.name === "amount" ? parseInt(e.target.value) : e.target.value

});

};
render() {

const { products, auth } = this.props;

const columns = [
  {apenas headers normais aqui}...

  {
    Header: "Código",
    accessor: "code",
    style: {
      textAlign: "center"
    },
    Cell: props => {
      return (
        <input
          name="code"
          type="text"
          value={this.state.code}
          onChange={this.handleChange.bind(this)}
          style={{
            width: "100px",
            height: "20px",
            border: "none"
          }}
        ></input>
      );
    },
    sortable: false,
    filterable: false,
    responsive: true,
    width: 150
  },
  {
    Header: "Movimentação",
    style: {
      textAlign: "center"
    },
    Cell: props => {
      return (
        <input
          name="amount"
          type="text"
          defaultValue={this.state.amount}
          onChange={this.handleChange}
          style={{
            width: "100px",
            height: "20px",
            border: "none"
          }}
        ></input>
      );
    },
    sortable: false,
    filterable: false,
    responsive: true,
    width: 150
  },
  {
    Header: "Movimentação",
    style: {
      textAlign: "center"
    },
    Cell: props => {
      return (
        <input
          name="date"
          type="date"
          defaultValue={this.state.date}
          onChange={this.handleChange}
          style={{
            width: "130px",
            height: "20px",
            border: "none"
          }}
        ></input>
      );
    },
    sortable: false,
    filterable: false,
    responsive: true,
    width: 150
  },
  {
    Header: "Opção",
    style: {
      textAlign: "center"
    },
    Cell: props => {
      return (
        <select
          name="option"
          value={this.state.option}
          onChange={this.handleChange}
        >
          <option value="Entrada">Entrada</option>
          <option value="Saída">Saída</option>
        </select>
      );
    },
    sortable: false,
    filterable: false,
    responsive: true,
    width: 100,
    maxWidth: 100,
    minWidth: 100
  },
  {
    Header: "Confirmar",
    style: {
      textAlign: "center"
    },
    Cell: props => {
      return (
        <input
          onClick={e => {
            this.handleSubmit(e);
            this.handleSubmitMovimentacao(e);
          }}
          value="Confirmar"
          type="submit"
        />
      );
    },
    sortable: false,
    filterable: false,
    responsive: true,
    width: 80,
    maxWidth: 80,
    minWidth: 80
  }
];
return (
  <div className="s-container">
    <ReactTable
      columns={columns}
      data={products}
    />
  </div>
);

}

}

const mapStateToProps = state => {

return {

products: state.firestore.ordered.products,

auth: state.firebase.auth

};

};
const mapDispatchToProps = dispatch => {

return {

updateProduct: product => dispatch(updateProduct(product)),

};

};

export default compose(

connect(mapStateToProps, mapDispatchToProps),

firestoreConnect([{ collection: "products" }])

)(Move2);

``
segue print: https://i.stack.imgur.com/ZkOdL.png

[jonetta]

Instead of using prop defaultValue, uses prop value in input.

Cell: props => {
      return (
        <input
          name="date"
          type="date"
          value={this.state.date}
          onChange={this.handleChange}
          style={{
            width: "130px",
            height: "20px",
            border: "none"
          }}
        ></input>
      );
    }