Questions tagged [use-context]

useContext is a React hook for managing global state through the Context API.

586 questions
2
votes
1 answer

React context (hooks) not updating all references

I am trying to implement a modal with a custom close callback. I did this with an useState hook that stores this method and executes it in an, already define, closeModal(). My problem is when I try to use the closeModal from context, the callback…
2
votes
1 answer

Getting InvalidValueError while passing state by useContext

I setup my context provider like so import { createContext, useState } from 'react'; export const AppContext = createContext(null); export default ({ children }) => { const [centre, setCentre] = useState({ lat: 53.719028, lng:…
Ricardo Sanchez
  • 4,935
  • 11
  • 56
  • 86
2
votes
1 answer

Typescript error TS2554: Expected 0 arguments, but got 1. while using useReducer and useContext with React

I have a number of useReducers and useContext where I am getting similar errors as the one listed below (TS2554). I have picked out the AuthReducer as it is the simplest. I get the same error for each Action dispatch. I've toyed around looking at…
2
votes
3 answers

React useContext & Typescript: Not an Array Type

I have created the following context using React createContext: import { useBoolean } from "@chakra-ui/react" import { createContext, FC } from "react" type useBooleanReturn = ReturnType export const MobileContext =…
Moshe
  • 6,011
  • 16
  • 60
  • 112
2
votes
1 answer

Create new key-value pairs using useContext and useReducer in React

I'm fetching data from an API using useEffect, this data is updating the context of my application by calling a dispatch function. I would like the same reducer function that updates the context to also calculate a few new key-value pairs in my…
ortunoa
  • 345
  • 4
  • 11
2
votes
1 answer

Cannot destructure property 'docs' of 'Object(...)(...)' as it is undefined

i'm trying to display images on a gallery by mappping through my images' collection in cloud Firestore, using useContext() but i have this error "Cannot destructure property 'docs' of 'Object(...)(...)' as it is undefined" Context: import {…
2
votes
0 answers

useContext() second argument is reserved for future use in React. Passing it is not supported

I have a lot of globally declared states in my application. I used useContext for implementing it, however, I keep getting a bunch of errors in the console regarding useContext. Error: Warning: useContext() second argument is reserved for future use…
MLICTM
  • 101
  • 2
  • 7
2
votes
1 answer

Reactjs useContent Hook return undefined when consuming a context

I created a user context in my App.js then I used context.provider to provide the context values to the children components. I can simply consume the context from the "login.js" component, but when I try to consume it from another component, it…
2
votes
2 answers

dispatch with UseReducer and useContext hooks: dispatch does not exist on type {}

I'm trying to build a small Cesium app with React that can zoom to various places on the globe by clicking a button associated with each location. I'm working on setting up the reducer using the useContext and useReducer hooks, but I'm having an…
2
votes
2 answers

Context returning undefined - useContext

I'm trying to set up useContext in the simplest way possible, but it keeps returning undefined. I've checked it several times but still can't decipher what I'm missing. Context.js: import React from 'react'; export const Context =…
dNyrM
  • 545
  • 1
  • 4
  • 17
2
votes
0 answers

Password-less Authentication with Firebase and React

I am trying to setup the Passwordless Firebase Authentication in my React (hook-based) project. The desired workflow looks like this: The user goes to the LoginPage (going to any PrivateRoute should not be allowed and should redirect the user to…
2
votes
0 answers

Best Practice: useEffect deps with setState or dispatch, via useContext or custom hook

I'm working on wrapping my head around all the best practices for dealing with the dependency array in useEffect(). First, some guidelines (from this blog post & elsewhere): If you're calling a function in useEffect that's only used within…
J23
  • 3,061
  • 6
  • 41
  • 52
2
votes
1 answer

React useContext Returning Undefined

struggling to with react contexts being used with functional components. I feel like I'm doing everything right here, so any help would be much appreciated. First I define a context (HeaderHoverContext.js) import React, { createContext, useState }…
2
votes
1 answer

Why my react app rendered twice and give me an empty array in first render when I'm trying fetching API?

The second render was success but the side effect is my child component's that using context value from its parent as an initialState (using useState hooks) set its initial state to empty array. I'm using React Hooks ( useState, useContext,…
2
votes
0 answers

Like / Unlike feature in ReactJS is 1 render behind

I am trying to implement a feature in my project where I can like and unlike a post. I am working with NodeJs, Express, and MongoDB for back-end and ReactJs and axios on front-end The problem is that my DB is updating real-time when I hit the…
Adrian
  • 65
  • 7