Strange behavior with a Material-UI and Redux text box trying to set a default value?

Question

I am trying to set the defaultValue property for a text field by getting a value from my Redux state, but it is not updated accordingly.

I passed the value as a support from the container component down to my editing component, for example:

render() {

const {data} = this.props

     return (
          <editcomponent value={this.props.data.value}
     )
}

const mapStateToProps = (state) => {

  return {
    data: state.dataReducer
  }

}

In my editing component, I tried to display it first, and this works fine:

render() {

     return (
          <h3>this.props.value</h3>
     )
}

When I reload the page with new data in my Redux state, it refreshes accordingly. However, when I try to do the same thing, except for the text field in which I set defaultValue, it does not update.

This does not work:

render() {

     return (
          <TextField id="textfield_id" defaultValue={this.props.value}/>
     )
}

, , , , , . , , .

? defaultValue, Redux, , / , .

Answer 1

, : fooobar.com/questions/504557/...

defaultValue, initialValues

initialValues: { name: theName }

Answer 2

, , , prop.

function updateValue(e) {
  this.setState({ value: e.target.value });
}

render {
  return (
    <TextField id="textfield_id" value={this.state.value} onChange={this.updateValue}/>
  );
}