为什么useReducer钩子不更新状态？
useReducer是React中的一个钩子函数，用于管理组件的状态。它接受一个reducer函数和初始状态作为参数，并返回当前状态和状态更新函数。
在使用useReducer时，如果状态没有更新，可能是由于以下几个原因：
- 状态更新函数未正确使用：useReducer返回的状态更新函数需要正确调用才能更新状态。确保在调用状态更新函数时传递正确的参数。
- 状态更新函数未正确返回新状态：在reducer函数中，需要返回一个新的状态对象，而不是修改原始状态对象。这是因为React使用对象的引用比较来判断状态是否发生变化，如果返回的是同一个对象，React会认为状态没有发生变化，从而不会触发重新渲染。
- 组件未正确使用useReducer：确保在组件中正确使用了useReducer，并将返回的状态和状态更新函数应用到相应的地方。例如，将状态应用到组件的渲染逻辑中，或者将状态更新函数传递给子组件。
- 组件未正确依赖状态：在使用useReducer时，需要将状态作为依赖项传递给useEffect或useCallback等钩子函数，以确保在状态更新时触发相应的副作用。
总结起来，如果useReducer钩子不更新状态，可能是由于状态更新函数未正确使用、未正确返回新状态、组件未正确使用useReducer或未正确依赖状态等原因。需要仔细检查代码，确保正确使用useReducer并遵循React的状态更新规则。
腾讯云相关产品和产品介绍链接地址：
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版（CDB）：https://cloud.tencent.com/product/cdb
- 云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
- 人工智能机器学习平台（AI Lab）：https://cloud.tencent.com/product/ailab
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iothub
- 移动应用托管服务（Serverless Cloud Function）：https://cloud.tencent.com/product/scf
- 对象存储（COS）：https://cloud.tencent.com/product/cos
- 区块链服务（Tencent Blockchain as a Service）：https://cloud.tencent.com/product/baas
- 腾讯云元宇宙（Tencent Cloud Metaverse）：https://cloud.tencent.com/solution/metaverse
相关·内容
1回答
我正在开发React中的登录/注册组件，并使用useContext和useReducer挂钩来管理状态。这是我第一次尝试这种方式，我不确定为什么状态没有改变。以下是登录组件的文件。: res.json().then(err => PromiseRejectionEvent.reject(err)); .then(data => data);这是状态管理器token: null, errorMsg: null,
浏览 30提问于2021-05-29得票数 1
回答已采纳
对于useState，我们可以使用函数更新，以便使用以前的状态计算新状态。编辑：const initialState = {count: 0};
const [s
浏览 2提问于2021-03-23得票数 0
回答已采纳
异步状态更新和类组件}function我的问题是:使用上面描述的组合对象(或useReducer)是否是在使用钩子时根据多个其他状态的值更新状态值的唯一合适和安全的方法
浏览 2提问于2020-09-14得票数 1
setValue(value)}>Click To Render</button> );现在根据的说法
为什么会这样呢？
浏览 1提问于2020-06-15得票数 1
回答已采纳
有人能解释为什么教练两次创建{currentUser: null}对象吗？一次在上下文中(第7行)，一次作为一个INITIAL_STATE在还原器中使用(第26和29行)。有多余的吗？import { createContext, useReducer, useEffect } from "react";
onAuthStateChangedListener,currentUser: null, con
浏览 4提问于2022-11-25得票数 0
我不想使用单一状态变量或使用功能组件更新整个状态。我写了一个基于useReducer的钩子，如下所示，但我不确定可能的危险效果。安全吗？谢谢。import React, { useReducer } from "react";
.
浏览 1提问于2021-10-22得票数 1
回答已采纳
1回答
下面是代码： (prevState, next) => next == null ? !prevState : next, )const [on, toggle] = useReducer(
(prevState: boolean, next?
浏览 7提问于2022-09-29得票数 1
回答已采纳
s({ b: 2, d: 4,}, true)st = {但是当您单击下面演示中的按钮时，它不会更新任何st。document.getElementById('root') <--现场演示
我怀疑我没有正确地绑定，或者可能有什么奇怪的反应钩子的工作
浏览 4提问于2019-04-07得票数 1
回答已采纳
我使用上下文来管理“筛选器”状态和“lastFetched”状态，该状态跟踪用户最后一次单击“应用过滤器”按钮(以及页面上的其他状态)的时间。对上下文的更新是通过useReducer钩子及其调度方法进行的(参见)。
数据获取发生在useEffect钩子中，每当“lastFetched”状态发生变化时，该钩子就会重新运行。这似乎是正确的；但是，该效果引用来自上下文的其他值(即筛选器)，这些值不包含在依
浏览 2提问于2019-09-15得票数 2
回答已采纳
import React, { useReducer } from "react";import { useDispatch } from "react-redux";
..。我看到所有的操作都会触发，但是useReducer调度不会更新redux状态。
浏览 0提问于2020-04-02得票数 8
回答已采纳
在研究了useState和useReducer之后，我对useReducer的代码感到困惑，所以还原器采用两个参数(状态、动作)，状态与initialState相同吗?如果是的话，为什么要使用两个不同的名称？第二，useReduer采用两个参数(还原器、initialState)和返回调度和状态对象。那么，这是否意味着减速器的动作首先发生，然后我们将其放入useReducer钩子中，这就像各种动作的容器？
我的意思是，一旦它采取了一些行动，国家就改变了
浏览 7提问于2022-09-21得票数 1
回答已采纳
我正在使用useReducer钩子来保存一些全局状态。因为我想在浏览器关闭时保存一些设置，所以我将这些设置保存到本地存储中。(有时我忘记保存到本地存储，并且状态/本地存储之间存在差异)
从本地存储中读取状态不是问题。为此，我在useReducer钩子中使用了initialState参数。我认为答案是不这样做，但有什么替代方案呢？(不使用redux)
浏览 93提问于2019-01-24得票数 6
我有一个使用useReducer钩子的组件： const init = { statB: true default: } const [state, dispatch] = useReducer但是当我查看日志时，它打印的是以前的状态，而不是当前更新的状态</
浏览 25提问于2019-04-07得票数 7
回答已采纳
当状态更新时，为什么此组件不更新？但是，当文件被更新时(比如编辑和保存代码)，组件将重新呈现并显示更新状态中的正确值。这是代码import ".} else { }
const [state, dispatch]
浏览 8提问于2021-12-23得票数 0
回答已采纳
2回答
因此，我们最近决定在当前的react应用程序中开始使用钩子。我们正在使用redux进行国家管理，我的问题是，这种方法是如何与钩子一起工作的？我读过一些文章，人们使用带有钩子的上下文api创建状态管理器，但我现在想继续使用redux。
我知道react有一个useReducer方法，可以用来分派redux操作吗？
浏览 1提问于2019-03-08得票数 1
回答已采纳
我使用包含状态的react钩子useReducer，假设我有3个状态字段- a，b和c。这些字段绑定在一起，并且大部分都是一起更改的-因此reducer函数是内聚的。如果我有不同的状态字段d，但对另一个状态没有内聚-我是应该在同一个组件中同时使用useState (用于d)和useReducer (用于a，b和c)，还是使用相同的reducer函数更好？
浏览 27提问于2019-04-09得票数 3
回答已采纳
2回答
作为钩子的新手，我正在转换一些具有多个状态属性的旧代码，在搜索如何减少我最初设置的useState钩子的数量时，我遇到了这段代码(丢失了链接)。下面的useReducer钩子代码可以正常工作。我想我理解状态值是通过setState (分派)更新的，我想弄清楚的是reducer的第二个参数是如何使用扩展语法在state和newState之间实际复制值的。我看过的所有示例都使用了switch语句和返回新状态的各种操作。React是否在后台做了一些事情来实现
浏览 18提问于2019-10-17得票数 1
我试图用localStorage创建持久状态，并在Next.js SSR应用程序中响应钩子，看起来一切看起来都很好，但是当我更新数据后重新浏览页面时，我得到了错误：
import React, { createContext, useContext, useReducer } from 'react'; pageView: 0,
export const Stor
浏览 4提问于2020-01-23得票数 2
如果我们看一下增量的标准示例，使用useReducer钩子进行减量： default: } const [state, dispatch] = useReducerbutton>
<button onClick={() => dispatch({type: &
浏览 4提问于2022-09-03得票数 1
回答已采纳
我正在使用useReducer钩子来管理我的状态，但在上下文提供程序中读取更新的状态似乎有问题。我的上下文提供程序负责获取一些远程数据并根据响应更新状态：import useAppState from '.: }
const initialState = { stateUpda
浏览 0提问于2019-04-02得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
