Question

我目前正在尝试第一次在我的react-app中实现redux。

我创建了一个reducer，与redux进行了反应，并在组件A中设置了一个动作-到目前为止一切都很好。但是，我该如何监听组件B内部的状态变化？

类似这样的东西：

changes.subscribe(value => {
   if (value === 1) {
       this.runSpecificFunction();
   } 
});

换句话说，我要订阅更改，并通过在组件B内部执行某些功能来对它们做出反应。我该怎么做？

到目前为止，我对组件B的了解-接收组件：

const mapStateToProps = state => {
    return {
        nav: state.navigation
    };
};

export default connect(mapStateToProps)(withRouter(CartHolder));

减速器：

const initialState = {
    navigation: 0 // inactive
};

const rootReducer = (state = initialState, action) => {
    switch (action.type) {
        case 'START_NAVIGATION':
            return {
                navigation: action.value
            };
        case 'STOP_NAVIGATION':
            return {
                navigation: action.value
            };
        default:
            return state
    }
};

export default rootReducer;

Answer 1

任何状态更改（无论是否基于Redux）都会重新呈现您的子组件。因此，使用useEffect挂钩应该适合您的用例（https://reactjs.org/docs/hooks-effect.html）。

您的示例中这样的内容：

const CartHolder = () => {
  React.useEffect(() => {
    myCallbackFunction(nav);
  }, [nav]);

  return (...);
};

通过执行组件内部的功能对Redux状态更改做出反应

1 个答案: