How is the input value in react Synchronize props

//constructor
this.state = {value: this.props.data.sid};
  handleChange(event) {
    this.setState({value: event.target.value});
  }

how about the initial value of value and the value of data.sid? Synchronize, after the change of sid, vlaue does not change

//render
<input value={this.state.value} onChange={this.handleChange}/>
Mar.04,2021

in your case, there is absolutely no need to set up state and ok directly with props.data

.
<input value={this.props.data.sid} onChange={this.props.handleChange}/>

ok when the data.sid is maintained by the parent component


add a life cycle, and componentWillReceiveProps, updates state during this life cycle


< input value= {this.props.data.sid} onChange= {this.handleChange} / >


maintenance the onchange method in the parent component input is also passed from the parent component so that the value in input just calls props.data.sid. It turns out that you bind the props of the parent component to the state of the child component, except for the first time and then will not assign a value to state

Menu