当前位置 : 主页 > 网页制作 > React >

reactjs – 在redux状态的语言环境更新后重新呈现React组件

来源:互联网 收集:自由互联 发布时间:2021-06-15
我在我的React应用程序中实现了Redux,到目前为止这个工作很好,但我有一个小问题. 我在导航栏中有一个选项可以更改存储在redux状态的区域设置.当我改变它时,我希望每个组件都能重新发
我在我的React应用程序中实现了Redux,到目前为止这个工作很好,但我有一个小问题.

我在导航栏中有一个选项可以更改存储在redux状态的区域设置.当我改变它时,我希望每个组件都能重新发布以改变转换.要做到这一点,我必须指定

locale:state.locale

在mapStateToProps函数中…这导致了大量的代码重复.

有没有办法隐藏地将locale传递给与react-redux连接的每个组件的props?

提前致谢!

Redux实现了一个阻止组件更新的 shouldComponentUpdate,除非更改了props.

在您的情况下,您可以通过将pure = false传递给connect来忽略此检查:

connect(select, undefined, undefined, { pure: false })(NavBar);

出于性能原因,这是一件好事,可能不是你想要的.

相反,我建议编写一个自定义连接函数,以确保区域设置始终添加到组件道具:

const localeConnect = (select, ...connectArgs) => {
  return connect((state, ownProps) => {
    return {
      ...select(state, ownProps),
      locale: state.locale
    };
  }, ...connectArgs);
};

// Simply use `localeConnect` where you would normally use `connect`
const select = (state) => ({ someState: state.someState });

localeConnect(select)(NavBar);  // props = { someState, locale }
网友评论