React: why child component doesn’t update when prop changes

by

Why in the following pseudo-code example Child doesn’t re-render when Container changes foo.bar? 

Container {
  handleEvent() {
    this.props.foo.bar = 123
  },

  render() {
    return <Child bar={this.props.foo.bar} />
}

Child {
  render() {
    return <div>{this.props.bar}</div>
  }
}

Even if I call forceUpdate() after modifying the value in Container, Child still shows the old value.

19 Answers
19

Leave a Comment