我有一个外部组件(可观察到的对象),我想听其变化。当对象被更新时,它会发出更改事件,然后我想在检测到任何更改时重新呈现该组件。
对于顶层,React.render这是可能的,但是在组件内不起作用(这是有道理的,因为该render方法仅返回一个对象)。
React.render
render
这是一个代码示例:
export default class MyComponent extends React.Component { handleButtonClick() { this.render(); } render() { return ( <div> {Math.random()} <button onClick={this.handleButtonClick.bind(this)}> Click me </button> </div> ) } }
在内部单击该按钮会调用this.render(),但这实际上并不是导致渲染发生的原因(您可以看到它在起作用,因为由创建的文本{Math.random()}不会更改)。但是,如果我只是打电话this.setState()而不是this.render(),它就可以正常工作。
this.render()
{Math.random()}
this.setState()
所以我想我的问题是: React组件 是否需要 具有状态才能重新渲染?有没有一种方法可以在不更改状态的情况下强制组件按需更新?
在组件中,您可以调用this.forceUpdate()强制重新渲染。
this.forceUpdate()
文档:https : //facebook.github.io/react/docs/component- api.html