Questions tagged [use-context]

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

586 questions
1
vote
2 answers

How do i fix "Cannot invoke an object which is possibly 'undefined'" error?

I am using CreateContext in Typescript and I can see why there is a problem with the code but I cannot work out how to resolve it. Its a basic use of typesafe TX to make state and (useReducer) dispatch available in a component hierarchy The…
Laurence Fass
  • 1,614
  • 3
  • 21
  • 43
1
vote
1 answer

OnClick toggles all items

I want to toggle each of the item that I clicked on but Its keeps toggling all the Items. Using the useContext api import React, { useState, useEffect } from "react"; const MyContext = React.createContext({ …
1
vote
0 answers

Persisting React Context State to IndexedDB

I am currently transitioning from persisting my React Context State from localStorage to IndexedDB. The reason being I've hit the 10MB limit already and thus ran out of space. Currently persisting the state to localStorage was fairly easy: import…
1
vote
0 answers

useContext return undefined

i tried to use useContext with my react app todo and i get undefined. i saw some answares in this site and tried some but still get undefined. this is my createContext file: ` import React ,{ createContext } from "react"; const TodosContext =…
dori rozen
  • 11
  • 2
1
vote
2 answers

react context not working when provider placed at certain parts of the element tree

I'm using a react context to manage a large input form, and I want the provider to be placed just around that input form. But it throws the following error: "A context consumer was rendered with multiple children, or a child that isn't a function. A…
BogdanB
  • 139
  • 10
1
vote
0 answers

how to grant login permission for all users on firebase?

I've used the firebase google sign-in authentication method to logIn and want to allow all users to do soo through their email when they try to login into the application. const[{user},dispatch]=useStateValue(); const SignIn=(e)=>{ …
1
vote
0 answers

Performance concerns with useContext and useReducer in React

Is there a way around re-rendering consuming components using useContexts with hooks? I am new to React and was looking into using useReducer for better state transitions.
Char
  • 21
  • 1
1
vote
2 answers

React.useContext not updating

This is my first time using the React context hooks in an app and I am trying to set the SelectedBackgroundContext and it will not update. console.log(typeof selectBackground) does appear as a function so I believe it is importing correctly and am…
ariel-walley
  • 17
  • 3
  • 9
1
vote
1 answer

React UseContext latest value

I have a react firebase Application for authentication. I am using Usecontext along with the setState. You can see the code below. This scenario works fine when user logs in for the first time or signs up. But as soon as I reload, the context value…
1
vote
1 answer

React UseEffect dependent on context does not update component immediately

I have a list of checkboxes where each is an individual functional component. There is a reset button which is expected to set all checkboxes to be unchecked. I am using context to store checked data values. I am using the following logic to update…
Helen
  • 11
  • 1
1
vote
2 answers

useEffect stuck in infinite loop with useContext

I have a functional component Pets that shows all of the pets of the current logged in user. Inside of my Pets component I am using useEffect and useState to achieve this. const [pets, setPets] = useState([]); useEffect(() => { const fetchPets…
Michael Torres
  • 512
  • 3
  • 21
1
vote
1 answer

Already populated array in useContext giving me an empty array when accessing it in a function inside of the same context?

The problem I'm having is, that I have a useContext in which I provide all logged users. On the initial run of the app or when the users' log in the array gets populated with all the users that are currently on the server... Which works as expected.…
1
vote
1 answer

Value of react context is not updated

I have a client implemented in react typescript, which needs to work with user data. Therefore, I've created an AppContext. //appState.ts export interface UserStateProperties { authenticated: boolean, user: GetUserResponse | undefined, …
sethgypt
  • 23
  • 7
1
vote
0 answers

useContext testing with react-testing-library

I want to write unite tests to my context&reducer hooks according to another question on stackoverflow i tried following code like this. Here is Modal.test.js : import React from "react"; import { render, fireEvent, screen, getByText } from…
Deniz Firat
  • 159
  • 1
  • 1
  • 10
1
vote
1 answer

How to make a reusable function that calls setUserContext? React Hooks useContext

So I have 4 components that are all doing the same thing inside an onClick handler. I have to define this code in every single one of them. The reason I don't know how to make this reusable is that you cannot call setUserContext inside a regular…
SoGoddamnUgly
  • 706
  • 4
  • 9