reactjs - this.forceUpdate() 中的 recompose withHandler

Question

我想this.forceUpdate()在我的撰写的 withHandlers 中使用名为“更新”的处理程序之一。我正在使用 recompose 来实现相同的目的。在下面找到示例代码：

const abc = compose(
    withHandlers(
      update: () => () => this.forceUpdate()
    )
)

但它不起作用。有谁知道如何在recompose库的withHandlers中使用forceUpdate()react 方法？

有没有其他方法可以达到与 相同的结果forceUpdate()？

Answer 1

您可以使用withState自己制作props.forceUpdate，因为所有状态更新程序都会触发组件重新渲染。

IE：

withState('_forceUpdate', 'forceUpdate')

然后props.forceUpdate()在哪里打电话。

Answer 2

您在this组件范围之外使用，因此this未定义。

我不知道你想达到什么目标，但你应该尝试另一种方式来做到这一点。

通常你应该尽量避免使用 forceUpdate()

Answer 3

生命周期中有 forceUpdate 。

我们像这样使用它：

import { lifecycle } from 'recompose';

const listensForChangingModel = ( propName='model' ) => lifecycle( {
        componentDidMount() {
                this.onModelChanged = () => this.forceUpdate();

                this.props[ propName ].on( 'change', this.onModelChanged );
        },  
        componentWillUnmount() {
                this.props[ propName ].off( 'change', this.onModelChanged );
        },  
        componentDidUpdate( prevProps ) { 
                if ( prevProps[ propName ].cid !== this.props[ propName ].cid ) { 
                        prevProps[ propName ].off( 'change', this.onModelChanged );
                        this.props[ propName ].on( 'change', this.onModelChanged );
                }   
        },  
} );

export default listensForChangingModel;

这会产生一个高阶组件，当模型触发更改事件时强制更新。