Best practice to update a form value from state and prop within React


Facebook recommends not to use the componentwillreceiveprops function. So I am searching for the current workaround that will update a form input value from a prop, but let the input be changeable via keyboard (onChange). In my case the prop is used to update the value with withTracker, but I also can set the value manually by keyboard.

Consider following Component:

class NameForm extends React.Component {
  constructor(props) {
    this.state = {value: ''};

    this.handleChange = this.handleChange.bind(this);

  handleChange(event) {

  render() {
    return (
          <input type="text" value={this.state.value} onChange={this.handleChange} />

export default withTracker(props => {


	return {
		subscription: AnyResource.findOne({})


Now I am wondering which lifecycle method can be used to update the state from the prop instead of componentwillreceiveprops.


Hi @radykal,

I was using getDerivedStateFromProps, but now im just not updating forms reactively, that was generating some confusion for the users. Now I just map the needed props to the state initially and dont update them later if they change.

You can check getDerivedStateFromProps here: