将Reaction上下文API与useReducer()挂钩一起使用有什么利弊？
我正在处理一个Web应用程序，我正在使用Reaction上下文，但没有使用useReducer()挂钩。这是我如何在我的应用程序中使用上下文的一个简单示例： const [stateValue, setStateValue] = useState(""); const [stateValue1, setStateValue1] = useState(""); const contextVal
..
react-context相关内容
如何从Apollo设置上下文http链接访问反应上下文
我正在尝试访问我的Apollo客户端的setContext函数中的Reaction上下文值。我希望能够使用Reaction上下文值动态更新每个GraphQL请求的头。但我遇到一个错误，日志中没有可见的错误消息。我正在尝试做的事情可能吗？ import React, { useState, useContext } from "react"; import { render } from "r
..
更新useContext中的值时，组件不会重新呈现
我正在使用React的上下文API来存储一组项。有一个组件可以通过useContext()访问该数组，并显示数组的长度。还有另一个组件可以访问该函数，以通过useContext更新该数组。将项添加到数组时，组件不会重新呈现以反映数组的新长度。当我导航到应用程序中的另一个页面时，组件重新呈现并反映数组的当前长度。每当上下文中的数组发生更改时，我需要重新呈现该组件。 我尝试使用Conext.Co
..
React Native with Context API 警告:“允许需要循环，但可能导致未初始化的值......"
当我在 Expo React Native 项目中使用 React 的 Context API 时，会收到以下警告: 要求循环是允许的，但可能导致未初始化的值.考虑重构以消除对循环的需求. 我正在 App.tsx 中创建上下文: import Start from "./start";导出 const AppContext = React.createContext({isLands
..
Next.js 的每页布局组件没有从 Vercel 的 swr 全局配置中获得价值
如果我明确输入提取器，来自 swr 的 useSWR 钩子在任何地方都可以工作. const { data } = useSWR("http://...", fetcher); 但是，如果我使用如下所示的 swr 全局配置，useSWR 仅在 First 页面中有效，而在 HeaderLayout 组件中无效.我做了一些调试，发现在 HeaderLayout 中没有收到来自 swr 全局配置的
..
单元测试:用酶反应上下文 api 返回一个空对象
我第一次尝试使用 React 上下文 API 将信息从主组件传递到孙组件. 所以首先我创建了一个上下文 const MyContext = React.createContext({});导出默认的 MyContext； 这里是设置上下文值的主要组件 从“./MyContext.js"导入MyContext；从“./ParentComponent.js"导入ParentComponen
..
Jest 模拟反应上下文
我需要一些帮助来理解如何使用 React Context 测试应用程序. 这是我的示例设置. context.js 从 'react' 导入 Reactexport const AppContext = React.createContext() App.js 从 'react' 导入 React从“./MyComponent"导入 MyComponent从 './context
..
在打字稿中使用带有反应钩子的反应上下文
下面的代码演示了我如何尝试使用反应钩子实现反应的上下文，这里的想法是我将能够像这样轻松地从任何子组件访问上下文 const {authState, authActions} = useContext(AuthCtx); 首先，我创建了一个导出上下文和提供程序的文件. import * as React from 'react';const { createContext, useState
..
反应 useContext() 性能，自定义钩子内的 useContext
我使用了一个使用 React Hooks 的结构.它基于一个全局的 Context ，其中包含了 reducer 的组合(如在 Redux 中).此外，我广泛使用 自定义钩子 来分离逻辑.我有一个包含异步 API 请求的钩子，它变得非常麻烦，我有机会将这个钩子的几乎每个函数拆分成其他钩子，但是这些函数中的每一个都使用全局上下文(更准确地说 - 从 useReducer() 调度)). 所以，
..
React useReducer Hook 触发两次/如何将道具传递给减速器?
前言/描述 我正在尝试将 React 的新钩子功能用于我正在构建的电子商务网站，并且在处理购物车组件中的错误时遇到了问题. 我认为，在讨论之前，我试图通过使用多个 Context 组件来保持我的全局状态模块化这一事实是相关的.我有一个单独的上下文组件用于我提供的商品类型，还有一个单独的上下文组件用于人们购物车中的商品. 问题 我遇到的问题是，当我分派一个动作将一个组件添加到
..
如何使用 useContext 更改 Context 的值?
在 React 16.8+ 中使用 useContext 钩子效果很好.您可以创建组件、使用钩子并使用上下文值而不会出现任何问题. 我不确定的是如何将更改应用于 Context Provider 值. 1) useContext 钩子是否严格来说是一种使用上下文值的方法? 2) 是否有推荐的方法，使用 React 钩子来更新子组件的值，然后使用带有此上下文的 useContext
..
为 React Context 实现 useSelector 等价物?
有很多文章展示了如何用上下文和钩子替换 Redux(参见 (注意:React Github 页面上的这个讨论表明它不能完成) 解决方案 不，这不可能.每当您将新的上下文值放入提供程序时，所有 使用者都会重新渲染，即使他们只需要该上下文值的一部分. 这是特别是我们放弃使用上下文的原因之一在 React-Redux v6 中传播状态更新，并在 v7 中切换回使用直接存储订阅. 有
..
如何从子组件内部更新 React Context?
我在上下文中有语言设置，如下所示 class LanguageProvider 扩展组件 {静态 childContextTypes = {langConfig: PropTypes.object,};getChildContext() {返回 { langConfig: 'en' };}使成为() {返回 this.props.children;}}导出默认语言提供程序； 我的应用程序代码如
..
如何从 Apollo set Context Http Link 访问 React 上下文
我正在尝试访问我的 Apollo 客户端的 setContext 函数中的反应上下文值.我希望能够使用反应上下文值动态更新每个 graphql 请求的标头.但是我遇到了一个错误，日志中没有可见的错误消息.我正在尝试做的可能吗? import React, { useState, useContext } from "react";从“react-dom"导入{渲染}；从“apollo-clien
..
使用 useEffect 更新 useReducer 'state'
在我的应用程序中，我使用的是 React Hooks/Context API.现在，每当我的 Provider 组件挂载时，我都需要将从 localStorage 获取的数据分配给 initialState.carts/state.carts.如果 useEffect 支持返回对象，这是可能的.但是不能在useEffect中返回对象！ 现在我该如何解决问题? 代码如下， cons
..
父更新会导致上下文消费者重新安装吗?
我有一个包装器组件，它创建一个上下文使用者并将上下文值作为道具传递给处理程序组件.当包装器组件的父级更新时，它会导致我的处理程序组件重新安装，而不仅仅是更新. const Wrapper = forwardRef((props, ref) => {类 ContextHandler 扩展组件 {componentDidMount() {//处理上下文作为副作用}使成为() {const { 数据，
..
React Context 不能使用 Provider
我正在简化尝试使用 React 更新 context 的过程.> 我希望当我点击标题 Hello CodeSandbox 时，加载栏会显示 context api 数据. 代码示例:https://codesandbox.io/s/vyq3r7k4o5 使用上下文加载 export const LoadingState = {加载:假};const LoadingContext =
..
使用 Context API 动态设置抽屉位置时，React 导航抽屉无法始终打开
我正在尝试实现一个抽屉位置和内容可以动态更改的单个抽屉. 我有一个抽屉导航器，里面有一个堆栈导航器.堆栈导航器的标题有两个按钮.左侧按钮将 drawerPosition 设置为 “left" 并调用 navigations.openDrawer()，右侧按钮设置 drawerPosition 到 “right" 并调用 navigation.openDrawer(). 我目前的实现是这
..
在上下文中反应传递缓存和获取/设置函数
我似乎无法让下面的代码工作.试图在反应中使用一些简单的“缓存"，我想使用上下文从 App 组件传递下来.状态存在于应用程序中，如下所示: const [cacheData, setCacheData] = useState({});const getCache = (key) =>{console.log('使用 key ' + key, cacheData 从缓存中获取值);返回缓存数据[k
..
使用 React-Context 时对象不可迭代错误
所以我最近开始使用 React 并且正在学习 Context Api.我的代码的热情是: export const UsersContext = createContext();导出函数 UsersProvider(props) {const fetchedItem = 异步函数 () {const data = await fetch('https://jsonplaceholder.typi
..