如何在调度动作后监听 Redux 存储中的特定属性变化

Question

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

以这个场景为例：

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

在此之后，我需要另一个依赖于同一个属性的组件来知道它已经更新并根据新值调度操作。

与使用某种类型的 value.on(change... 解决方案相比，处理此类操作的首选方法是什么 'cascading'？

Answer 1

有两种基本方法：要么是在操作完成后区分状态的中间件，要么使用 Redux 的低级 store.subscribe API.

Redux 常见问题解答 an answer that covers this. Also, I keep a categorized list of Redux-related addons and utilities, and that includes a group of existing store change subscription libraries 实施了多种侦听数据更改的方法。

Answer 2

您可以将 Redux 的 mapStateToProps 和 connect 与 React 的 componentDidUpdate(prevProps, prevState, snapshot) 钩子一起使用。

基本上你的代码应该是这样的：

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);

如何在调度动作后监听 Redux 存储中的特定属性变化

How to listen for specific property changes in Redux store after an action is dispatched

reactjs

redux

redux-thunk

如何在调度动作后监听 Redux 存储中的特定 属性 变化

How to listen for specific property changes in Redux store after an action is dispatched

reactjs

redux

redux-thunk

如何在调度动作后监听 Redux 存储中的特定属性变化