问题标签 [use-reducer]

如何等待调度更新状态？我在 useReducer API 文档中没有找到任何内容，在 TypeScript 类型定义中也没有找到任何指示。

这是我尝试过但没有奏效的方法：

我正在尝试使用上下文 API 和 useReducer Hook 构建购物车，我具有此功能，用户需要单击按钮将商品添加到购物车，并且应用程序将发出 api 请求以添加商品在服务器上，它将项目返回到前端，应用程序将调度一个操作来更新 UI，从购物车中删除项目也是如此，但问题是应用程序在我刷新之前不会更新 UI这页纸。

推车减速机：

这是我处理这个问题的功能，希望你们能提供帮助，非常感谢你。

我想使用 useContext() 和 useReducer()，剥离 redux 以保存另一个包并学习一种新的状态管理方式。我击中了一个拦截器。

在reducer更新payload之后的登录页面。可以在下面的屏幕截图中看到。我可以看到 Context.Provider 和 reducer 值已更新，但如果我要 console.log('context') 我仍然会得到初始值。

我想在组件之间共享更新的有效负载是 localStorage 本地执行此操作的唯一方法吗？还是我在概念上遗漏了一些东西。

提前致谢。

这是我的 App.tsx

这是我的 AuthProvider：-

这是我的 authReducer：-

这是我的登录页面：-

所以我几天来一直在尝试解决以下问题：

我已经有一种方法可以在该数组中添加和删除电影，但我希望每个项目都有一个输入部分，其中评级状态将更新为输入值。我一直在使用“useReducer”来帮助解决这个问题，但我想我只是不确定语法/有效负载是什么？

我知道有一种方法可以做 movies.map(movie=> {etc.etc.} 但我似乎无法弄清楚。非常感谢帮助。

编辑：

我希望输出看起来像这样，其中 {movie.rating} 对象的状态在输入更改时更新

我对编码很陌生，我目前正在练习useReducer()React 中的钩子，以在一个简单的待办事项应用程序中管理一些状态。尝试实施 TOGGLE_TODO 操作时遇到问题。我在使用数组之前已经完成了它，但是由于我可能会使用很多对象，所以我试图弄清楚为什么我不能做到这一点。我会说我正在通过失败来学习，但我正在学习的只是如何关闭计算机并走开！

每次切换时，我都会使用扩展运算符传递状态，我已经在所有项目中尝试过，我已经注销key并action.payload确保我得到匹配（当我执行带有匹配的简单警报）。

我知道切换还不是切换，我只是想简单complete地成为true.

我尝试了很多方法来返回状态，我已经在语句的开头添加了返回，并且在此过程中我遇到了一些奇怪的错误。如前所述，目前这是非常简单的状态，但它会在我正在处理的另一个项目中更复杂，所以 useState 变得非常混乱。

对我在这里做错的任何帮助将不胜感激。

在渲染中，我将它key作为一个传递，id因此它可以与有效负载一起返回。这是dispatch组件的功能...

并且渲染正在使用Object.entries，一切正常。有时我会遇到错误，或者初始todo状态会消失，所以我知道状态没有正确更新。

这里也是CodeSandbox 上的代码。如果我让它工作，我会在这里更新，但我已经被困在这里几天了。:-(

I'm creating a custom hook to be reused all over the app but I got unexpected results as you can see through the comments in the code the actions are dispatched successfully and has the expected payload value and any code I pass to them runs successfully like console.log but they dispatched twice and when trying to get the value of state I didn't get the expected state after dispatching some actions I got the default one.

on Component, I used this hook code is like this

I really want to continue with this custom hook approach but these bugs I really hope someone could help. thanks

我正在使用 React 挂钩useReducer来管理类似购物车的应用程序的状态。我cartReducer习惯于处理添加/删除/更改项目数量：

cartReducer在我的购物车组件中使用了减速器：

现在，我想使用我喜欢的库添加通知，但我不知道如何处理它。我想我有3个选择：

1. 选项1：污染我调用库的reducer，即showSuccessToast()在返回新状态之前添加类似的函数；
2. 选项 2：创建新的操作，例如ACTIONS_TYPES.SHOW_SUCCESS_TOAST，但这需要我更改所有dispatch()调用；
3. 选项3：创建一个新的cartNotificationReducer添加功能，如showSuccessToast()

我知道某些选项可能是反模式，所以我认为选项 3 是最好的。但是useReducer只接受一个减速器......我该如何组合它们？

我正在使用 React 上下文构建类似/不像功能的帖子，但我不知道在 reducer 中要做什么来更新 UI。目前，当我点击喜欢/不喜欢按钮时，ui 不会立即更新，必须刷新页面才能看到更新。

后端逻辑

零件

语境

减速器

reducer 的逻辑应该是什么？

在使用 React Context API 以及 useReducer 和 useContext 钩子的奇怪情况下，我有点陷入困境。

这是我的主要商店。

这是我的 Reducers 函数和我的 Action 类型：

我的编辑属性中有一个显示属性，用于有条件地呈现反应门户，见下文：

这是实际的编辑调查组件：

我的问题是，当我单击门户上的关闭按钮时，它会分派 HIDE_SURVEY，然后立即分派 DISPLAY_NEW_SURVEY：

我一生都无法弄清楚这一点。任何帮助将不胜感激。

谢谢！

更新：问题直接在reducer中，与onClick函数和deleteLastItem函数无关。我用console.logs对此进行了测试，显然唯一重复两次的是直接在reducer中的那个。

我同时测试了钩子 useReducer 和 useContext ，因为我认为它们可以很好地协同工作，但显然，当我将一个函数设置为 onClick 函数时，它会被触发两次，而且它不是因为我'正在删除数组中的最后一项，因此它删除了两项而不是一项。

这是存储上下文和 reducer 挂钩的文件：

如您所见，console.log("hey"), 告诉我它被执行了两次（除了看到屏幕中的项目一次被清除两次）

这是引入上下文以及出现问题的组件：

最后，这里是 app.js，我认为它没有用，但以防万一：