Javascript 状态更改时如何重新呈现react类组件

react和javascript都是新手，想知道如何重新呈现组件？ 我需要确保按钮组件中的细节（例如，徽章计数器）在每次我们得到面变化时重新呈现。 我看到其他开发人员尝试设置state，但它似乎不起作用，所以我需要以下方面的指导

如何检测刻面何时发生变化

如何在每次面发生更改时重新渲染组件

类搜索结果扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
_查询：props.query，
_面：道具，面，
_hassloaded:false，
};
}
render（）{
常数{
OneTityClick、facets、entity、total、pagingTotal、isFilterSubmitted、loading、query、，
}=这是道具；
常数{
_查询、\u面、\u已加载、，
}=本州；
如果（_query！==query&query！='*'）&&&！正在加载）{
这是我的国家({
_查询：查询，
_面：面，
});
}
如果（_query===query&&query=='*'&&&&！_hasload）&&&！正在加载）{
这是我的国家({
_查询：查询，
_面：面，
_是的，
});
}
返回(
onEntityClick（'note'）}
/>
);
}
}

您正在代码中创建反模式：

this.setState（）

不应在

render（）函数中调用。

相反，您要做的是检查
componentdiddupdate（）
：

这保证了重新渲染，因此您无需担心“手动”重新渲染

还要注意的是，除非需要修改组件的副本，否则不需要将
props.query
以及其他值保存在组件的
state
中，这就是didUpdate将要做的事情。
如果props发生更改并设置状态，可以尝试组件将接收propsLC方法（重新渲染）根据该变化对组件进行了调整

UNSAFE_componentWillReceiveProps(nextProps, nextContext) {
    console.log(nextProps.facets);
    console.log(this.state._facets);
    if (nextProps.facets !== this.state._facets) {
        this.setState({
            _facets: 'YES'
        })
    }
}

componentDidUpdate(prevProps) {
  if (prevProps.query !== props.query && query !== "*") {
    ...
  }
}

UNSAFE_componentWillReceiveProps(nextProps, nextContext) {
    console.log(nextProps.facets);
    console.log(this.state._facets);
    if (nextProps.facets !== this.state._facets) {
        this.setState({
            _facets: 'YES'
        })
    }
}