reactjs - 分派(dispatch)操作后如何监听 Redux 存储中的特定属性更改

Question

我目前正在尝试概念化如何根据在另一个组件中分派(dispatch)后的数据更改来处理在组件中分派(dispatch)操作。

以这个场景为例:

dispatch(someAjax) -> 状态更新中的属性。

此后，我需要另一个依赖于同一属性的组件来知道它已更新并根据新值分派(dispatch)操作。

处理此类“级联”操作的首选方法是什么，而不是使用某种类型的 value.on(change... 解决方案？

Answer 1

您可以将 Redux 的 mapStateToProps 和 connect 与 React 的 componentDidUpdate(prevProps, prevState, snapshot) Hook 结合使用。

所以基本上你的代码可能如下所示:

const mapStateToProps = (state) => ({ 
   specificProperty: state.specificProperty,
   // any props you need else
});

class YourComponent extends React.Component {
    render() {
      // render your component  
    }

    componentDidUpdate(prevProps, prevState, snapshot) {
        if (prevProps.specificProperty !== this.props.specificProperty) {
            // Do whatever you want
        }
    }
}

YourComponent = connect(mapStateToProps)(YourComponent);