强制子组件重新渲染（React）

Question

我有一个第三方组件，当我传递给它的道具发生变化时，我需要完全重新渲染它。

如何让它在不让供应商更新他们的代码的情况下完全重新渲染？（似乎是他们代码中的一个缺点）

我试过了this.forceUpdate()，但它没有完全重新渲染它们的组件。

Answer 1

使用您想要监控的道具作为key您尝试重新渲染的组件。

例如 <ThirdPartyComponent key={this.props.foo} ...>

——

如果您需要监控不止一个道具，请考虑以一种代表其目的的方式组合它们（如果一个改变，它们都会改变）。下面假设它们都是字符串。

例如 <ThirdPartyComponent key={`${this.props.foo}/${this.props.bar}`} ...>