问题标签 [easy-peasy]

是否可以将 redux-form 与 easy-peasy 一起使用？

我试试这样

然后在我的表单组件上

export default reduxForm({ form: 'login' })(Login);

但我得到一个错误

Could not find "store" in either the context or props of "Connect(Form(Login))". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(Form(Login))".

好吧，我猜这是因为 reduxForm 在内部使用 react-redux 连接。有没有办法解决这个问题？

我有一个显示项目列表的功能组件。这些项目是通过 Ajax 获取的。我将React与状态管理库Easy Peasy一起使用。

这会正确加载我的项目一次。但我想反复重新加载它们。所以我找到了一个自定义钩子：

但当我这样做时，

我收到以下错误：

如何反复重新加载我的物品？

为什么我不能以这种方式返回新状态（重置操作）？

我正在尝试实现此处描述的内容：https ://github.com/ctrlplusb/easy-peasy/issues/146

工作示例：https ://codesandbox.io/s/easy-peasy-typescript-v3-vzc11

我想弄清楚，如何用easy-peasy制作一个自复位模型。基本上我想调用setInGridAnimation一次，然后在 400 毫秒内自动重置，这样我就不用再担心了。原因很明显，有一个动画需要 400 毫秒，而“动画中”状态必须切换 400 毫秒。这是我尝试过的：

这失败了，因为TypeError: Cannot perform 'get' on a proxy that has been revoked我测试的其他类似版本同样失败了。我猜是有道理的，但是如何在代理尚未被撤销且仍有延迟的情况下访问它？

从架构的角度来看，我不太确定我的方法是否正确，因为我没有大量使用 Redux 的经验，所以我寻求架构帮助和解决这个特定问题的帮助。

首先对我需要实现的目标进行一些描述。我在前端（React）中显示主要对应于数据库行的信息，用户可以对这些对象执行常规的 CRUD 操作。但是，我还在发送到前端的 JSON 中添加了一些虚拟行，因为有些对象是“默认值”，除非用户真正想要修改它们，否则不应将它们插入数据库。所以我需要做的是一旦用户想要在前端修改一个“默认”对象，我首先必须将该对象发布到一个特定的端点，将它从常量复制到数据库，然后再跟进请求修改该行。

其次，围绕此的架构。为了在前端存储行的状态，我通过easy-peasy使用 Redux，并且thunk在修改之前进行了第一次保存。一旦用户想要在 UI 中的任何位置编辑“默认”对象（大约有 20 种不同的编辑对象的方法），程序的流程如下所示：

1. 用户编辑某些内容并按“保存”
2. 在保存函数中调用 Thunk 并await编辑
3. Thunk POST 到后端以将对象插入数据库并返回相应的行
4. 后端以行的 ID-s 响应
5. Thunkaction使用正确的 ID 调用并更新存储中的这些对象
6. Thunk 返回，函数指针移回修改函数
7. 修改函数使用正确的 ID-s 发出另一个请求
8. 修改函数用修改后的值更新存储

现在，我遇到的问题是从第 5 步到第 7 步，因为组件看起来基本上是这样的：

如果你比我更了解函数式组件，那么你就知道会更新 Redux 存储中onSave()的insertToDatabaseIfNecessary()值，但是当我们进行实际修改时，post(...items)发布的值不会更新，因为它们将在下一个更新调用组件的时间。如果这是基于类的组件，它们将被更新，但 easy-peasy 不支持基于类的组件。我想一种方法是直接使用基于类的组件和 Redux，但我觉得可能有一种不同的模式可以用来解决我的问题，而无需求助于基于类的组件。

问题：有没有一种理智的方法可以用功能组件做到这一点？

最近发现了这个库：https ://easy-peasy.now.sh/ 实现了，不得不说还不错。为什么它不像redux那么流行？为什么人们在可以使用它时倾向于使用redux？两者的优点和缺点是什么？还想知道当我可以做这样的事情时，状态的不变性是如何保存在简单的 peasy 中的：

显然它会改变状态..也许它不会改变实际状态？一般来说，想知道是否保留了所有 redux 原则，两者之间的主要区别是什么？

可以说这是我的代码

当我试图 console.log 它没有显示新的捐赠数据

创建商店后导入商店会导致此问题。

store.ts

上面代码片段中要注意的重要行是injections: { ...services }. 它将所有服务作为用于进行 API 调用的函数注入。

服务/index.ts

服务/places.ts

下面给出的代码片段创建了一个依赖循环。

服务/api.ts

正如您可能在上面可用的代码片段中观察到的那样，我正在尝试使用可通过商店获得的简单易用的redux 操作从单点处理错误和加载状态。

具体来说，import store from '@store/index';创建依赖循环。

但是，由于注入只不过是反过来使用存储的服务，因此形成了依赖循环。

存储 -> 注入 -> 服务 -> 地点 -> API 实例 -> 存储

我确实有解决办法。我可以通过调用服务的方法传递动作。例如，

模型/地点.ts

但是，使用上面显示的方法，我必须继续将存储操作作为第二个参数传递给所有服务。

如何通过共享存储操作来打破依赖循环，以确保 API 实例可以从单个位置设置错误和加载状态？

主页.js

由于onClick={() => add()}上面的代码行，我遇到了这个错误：错误：createDraft 的第一个参数必须是普通对象、数组或可浸入对象

这就是model.js文件从我得到它的地方state.count和上面的文件actions.add中的样子Home.js，如果它有用的话：

模型.js

这是回购的链接：https ://github.com/charanpreet-byte/Commerce-website/blob/master/client/src/pages/Home.js

这是我的代码。我想采取行动，上述错误不断出现。

这是我的集合对象，我想访问 fetchCollections。这是任何简单的反应状态管理代码。PS：这里我删除了fetchCollectionsRequest、fetchCollectionsSuccess、fetchCollectionsFailure。

这是我的model.tsx