问题标签 [redux-thunk]

所以我有这个简单的异步请求动作创建器，它使用axios请求请求和redux-thunk调度动作。我想为不同的请求重新使用相同的动作创建者——所以每个请求都有自己的状态。我会尝试展示一些代码，然后再解释更多。这是我的动作创建者

还有我的减速器reducerRequest：

这里开始我的问题

我像这样组合减速器：

在我的组件中：

问题：我想为不同的请求重新使用我的动作创建器。我怎样才能

1. 打电话makeRequest('www.defaults.com')，它最终在defaults
2. 打电话makeRequest('www.updates.com')，它最终在updates

现在我可以想象解决这个问题的唯一方法是为每个请求编写它自己的动作创建者和自己的减速器 - 只是大量的复制粘贴 - 这感觉不对。

我怎样才能重用我的动作创建器和reducer来在我的组件中创建2个单独的defaults实例updates？

使用React, Redux，Redux-thunk我想通过服务器请求（API 调用）获得初始状态，但我似乎无法让它工作。

到目前为止我得到了什么：

这是我最初的商店创建。我的InitialState样子是这样的：

当我尝试将其loadInitial转换为$.get('api/...')时，Redux 告诉我我需要一个初始状态才能使其工作。

在我的减速器中，我有一个加载方法：

但同样，如果我使用 - 作为默认值 - 异步调用，它似乎不起作用。

我真正想要的是用来自数据库的任何东西来初始化我的商店。这对于我的 HandsonTable 来说是必需的，因为我将属性传递给了表，并且正如我现在所拥有的那样，它只会为我呈现一行，因为我的初始状态只有一个对象。

奇怪的是，当我点击表格时，它实际上得到了我所有的行，因为数据已加载，但我猜为时已晚。

无论如何，我的问题是，如何通过对后端的 api 调用来初始化我的商店？

当我尝试在 redux 中调度异步操作时遇到问题。我正在使用 redux-thunk 来处理我的异步中间件。

我有一个像这样的异步操作功能：

这是我的 createStore 语句：

当我尝试这样做时：store.dispatch(async())我遇到了这种错误：

错误 TS2345：“（调度：任何）=> void”类型的参数不可分配给“操作”类型的参数

当我只使用 javascript 时，代码本身就可以工作。

我正在尝试设置 redux、react-redux 和 redux-thunk。想法通常进展顺利，但我有一个问题，当将多个异步操作链接在一起时，事情应该如何看待。

具体来说，我有一个场景，可以通过另一个可以调用它们的动作单独或间接调用这些动作。我的问题是，selectItem如果我想成为惯用语，应该如何创作？

动作.js

为了模块化，我的 Redux 应用程序被分解为单独的组件，app域是一种共享基础架构组件，它处理常见的 ui 更改，例如加载指示器。

在我的根减速器中，我使用该combineReducers函数根据我的域很好地拆分状态树：

所以我的状态树是这样的：

好的，所以现在我想添加一些异步功能到users它们products从服务器获取数据的位置。redux-thunk使用类似或承诺中间件的东西是微不足道的。所以动作创建者users/actions.js可能看起来像这样：

请记住，它products也可能会做类似的事情来获取自身。
现在，处理这些动作并在子树上usersReducer设置不同的状态道具。users问题是，我还想loading: true在app子树中设置一个，以便我的高级app组件能够呈现一个很好的加载指示器。但是usersReducer没有得到状态树的那一部分。

如果不编写combineReducers将所有减速器发送到整个状态树的自定义，那么优雅的实现方式是什么？我正在寻找一个干净且可扩展的解决方案。这是我考虑的几种方法：

1)appReducer对每个新请求做出响应。这意味着每次为 fetch 创建新的操作类型时，我都需要将其添加到app/app_reducer.js：

这样做的问题是我必须修改appReducer我创建的每个需要加载指示器的新操作。

2）第二种方法是创建另外两个被调用的动作startLoading，stopLoading它们将从异步动作中调用，如下所示：

乍一看，这似乎是个好主意，但调用 2 个动作而不是一个动作看起来很浪费。

我想这是一个常见问题，但我找不到任何实用和“现实生活”的建议。我很高兴听到任何其他解决此问题的方法或对给定建议的想法。

正如您在 Redux 源代码的这一行中看到的，动作必须有一个type属性。在源代码存储库中的真实示例中，有一个类似这样的操作，没有type声明任何属性。

这里CALL_API所指的是一个 JavaScript符号

在旁注中，来自 Mozilla 站点，您似乎访问了带有数组括号的符号

所以，回到 redux 代码，在没有显式类型的情况下处理操作的中间件似乎访问了由 CALL_API 创建的属性......

回到上面引用的第一个代码，如果我像这样从调用 api 周围删除数组括号

我收到错误消息，“操作可能没有未定义的“类型”属性”。

问题：例如，在 fetchUser 函数中（正确）使用符号如何满足对操作的类型属性的要求？

我正在尝试使异步调用正常工作，但遇到了设置障碍。我刚刚阅读并复制了这个异步示例，然后尝试将一些位复制到我的应用程序http://redux.js.org/docs/advanced/ExampleRedditAPI.html

我的应用程序不会显示任何错误，并且 React 元素不会被放入 DOM，我只能显示我的 index.html...

如果有人可以检查反应代码所在的客户端文件夹，那将是惊人的（index.html 在根目录中的视图文件夹中，捆绑在 public/javascripts 中） https://github.com/jaegerombombb/twitter-api-test

不知道出了什么问题，我想知道将来如何调试此类问题

额外信息：

我从客户端/twitter 文件夹中的一切工作开始（一个按钮显示全部显示，另一个显示全部隐藏，显示一个字符串）。我的添加在 Tweets 文件夹和 appComponent/index 文件中

我对 React 和 Redux 还很陌生，在想出构建异步文件上传的最佳方法时遇到了一些麻烦。

我想要的是

1. 用户点击表单的提交按钮
2. 上传文件，服务器返回上传文件的路径
3. 在发送最终 POST 请求之前，使用这些路径更新状态

我现在想做的是将表单或某些更高级别的组件传递给动作处理程序，就像这样

这是一个坏主意吗？有没有FormData比将表单元素传递给动作创建者更好的方法？

我有一些 redux-thunk 动作/异步动作，Istanbul 指出一些未导出的函数没有被涵盖。

所以，我想知道有没有办法测试它？我的一个异步操作还执行各种 if 语句，以确保 API 确实返回信息，如果不是，它返回一个空数组（不知道它是否正确，猜不准（那应该怎么做？） )

这是我正在谈论的示例屏幕截图：

主题行非常清楚地总结了这个问题。

尝试将项目发布到数据库，然后从 POST 请求中检索新集合。

第一个控制台日志会触发，但其余的不会。我无法测试 makeStaffEntry，因为我无法获取“调度已触发”日志。

存储配置