React：更新具有父状态更改的子项

Question

我很确定我在这里遗漏了一些非常明显的东西，但似乎无法让它发挥作用：

我有一个调用两个孩子的父组件。

PARENT

<PropertyCard model={property} onMouseOver={this.handlePropertyCardHover.bind(this, property)} />
<Map markers={places} options={mapOptions} activeRef={this.state.hoveredCard} />

当我将鼠标悬停在PropertyCard上时，会调用一个函数来更新父级中的状态hoveredCard。

PARENT

handlePropertyCardHover = (property) => {
    this.state.hoveredCard = property.id;
}

这部分有效，我可以看到父状态在传递给第二个孩子时尚未更新，Map没有更新。

MAP

<h1>{this.props.activeRef}</h1>

我错过了什么？

Answer 1

如果要更改状态，则必须使用this.setState。

this.setState({hoveredCard : property.id})

而不是

this.state.hoveredCard = property.id;