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

发布时间：2020-12-15 09:32:01 所属栏目：百科来源：网络整理

导读：我在我的React应用程序中实现了Redux,到目前为止这个工作很好,但我有一个小问题. 我在导航栏中有一个选项可以更改存储在redux状态的区域设置.当我改变它时,我希望每个组件都能重新发布以改变转换.要做到这一点,我必须指定 locale：state.locale 在mapStateTo

我在我的React应用程序中实现了Redux,到目前为止这个工作很好,但我有一个小问题.

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

locale：state.locale

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

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

提前致谢！

解决方法

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

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

connect(select,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 }

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!