在 redux 库之间建立通信的最佳方式



我们试图将我们的项目分成几部分:

我们有库,例如用户库和图像库。 每个库都有自己的化简器,以及例如:

对于用户库:

{isloggein: false} // store
function logIn() { //action creator 
return {
type: 'LOGIN'
};
}

对于图像库:

{images: []} // store
function addImages() { //action creator 
return {
type: 'ADDIMAGES'
};
}

现在我们决定在用户登录后立即添加图像。问题是图像存储现在没有关于用户操作的内容(这是代码拆分的主要思想(。我们通过使用这样的传奇解决了这个问题:

function* addImagesWhenLogIn() {
while (true) {
yield take('LOGIN');
yield put(addImages());
}
}

但它并不透明(我们发送了一个操作,但实际上将发送 2 个操作(。虽然在 sagas 中拥有应用程序的业务逻辑很好,但我相信在这种情况下,take -> put序列不是最好的解决方案,我正在寻找更好的方法。

redux 架构的一些优点是能够轻松进行水合作用、快照、时间旅行,如果只有一个存储状态的位置,它的效果最好。

来自 redux 文档:

单一事实来源 - 存储整个应用程序的状态 在单个存储区中的对象树中。裁判。

因此,建议对 redux 应用使用唯一状态。

在您的情况下,我建议:

  • 您可以保持分离的库/模块,根据需要在应用程序中导入它们。
  • 仅使用一个状态树,如 redux 文档中的建议。
  • 使用容器向表示组件提供状态信息。

我认为这是一种完全有效的方法。 您的两个主要选项是让一个模块从另一个模块导入操作创建者(从而在某种程度上直接耦合两者(,或者使用单独的代码段将两者粘合在一起。 使用这样的传奇是处理"胶水"方面的非常好的方法。

最新更新