react-context

How to use React's context API outside of react's component scope : ReactJS

此生再无相见时 提交于 2020-01-07 09:37:08
问题 I am using react's context API for storing USER_TOKEN for authentication purposes. Also I am maintaining a common fetch function in a separate module where I want to use this USER_TOKEN. And Its obvious that I cannot use this USER_TOKEN inside this module as it is not a react component. Is there any way I can use this USER_TOKEN inside this fetch function. I am storing USER_TOKEN into a context API variable after successful sign-in. Yes I know we could pass the variable from context whenever

Combine Reducer without Redux

浪尽此生 提交于 2020-01-03 17:09:18
问题 I have an application without redux, I handle the global state with hooks and the hook useReducer + context. I have 1 useReducer which makes like a Redux store. But to do this I can only send 1 reducer. In that reducer I have all the logic of the states, but I want to separate some functions of that reduce in other reducers. In redux there is the combineReducer to do this. But with hooks + context, how can I do this? How do I combine many reducers to send it to my Global Provider in the

React Context API not updating store

旧街凉风 提交于 2020-01-03 05:33:08
问题 I am working on refresh token. I faced some problems with context api store. Store gives me old value. Please look at refreshToken method there is comment explaining error. I dont't understant why if I console.log(store) React return me old value not new value. Repeating because Stackoverlow ask me to more describe text I am working on refresh token. I faced some problems with context api store. Store gives me old value. Please look at refreshToken method there is comment explaining error. I

React Context API not updating store

丶灬走出姿态 提交于 2020-01-03 05:33:07
问题 I am working on refresh token. I faced some problems with context api store. Store gives me old value. Please look at refreshToken method there is comment explaining error. I dont't understant why if I console.log(store) React return me old value not new value. Repeating because Stackoverlow ask me to more describe text I am working on refresh token. I faced some problems with context api store. Store gives me old value. Please look at refreshToken method there is comment explaining error. I

How to change React context programmatically?

为君一笑 提交于 2020-01-01 03:00:24
问题 I'm trying to use the new React context to hold data about the logged-in user. To do that, I create a context in a file called LoggedUserContext.js: import React from 'react'; export const LoggedUserContext = React.createContext( ); And sure enough, now I can get access to said context in other components using consumers, as I do here for example: <LoggedUserContext.Consumer> {user => ( (LoggedUserContext.name) ? LoggedUserContext.name : 'Choose a user or create one'; )} </LoggedUserContext

React pass cache and get/set function in context

痞子三分冷 提交于 2019-12-24 21:42:35
问题 I cant seem to get the below code to work. Trying to have some simple "cache" in react which I want to pass down from the App component using context. State is present in App as follows: const [cacheData, setCacheData] = useState({}); const getCache = (key) => { console.log('Getting value from cache with key ' + key, cacheData); return cacheData[key]; } const setCache = (key, data) => { try{ console.log(cacheData); console.log('Setting value to cache with key ' + key, data); let dataCopy =

React JS: Get Context Data After getting success on API Call

白昼怎懂夜的黑 提交于 2019-12-24 21:35:41
问题 I am stuck at getting context data. I have a context and a component which uses its data. I need to get the updated data of context's variable on API call success in my component. so How can I do that ? Here what I have tried. context.js import React, { useState, createContext,useEffect } from 'react'; import {getData} from './actionMethods'; const NewContext = createContext(); function newContextProvider(props) { const [dataValue, setData] = useState([]) useEffect(() => { const fetchMyData =

TypeError: render is not a function when I use React Context API

北战南征 提交于 2019-12-23 23:17:43
问题 I'm using React Context API In Project Step:1 In my project first createContext API a separate file. fileName Contextapi.js import React from 'react' // createcontext api here const MyContext = React.createContext(); // create MyContext provider export const Provider = MyContext.Provider; // create MyContext Consumer export const Consumer = MyContext.Consumer; Step:2 Using contextApi provide state data to MyContext provider component import React, { Component,Fragment } from 'react' // all

React - Can you update an Unstated container state from an external function?

久未见 提交于 2019-12-23 17:33:38
问题 In the example from the Unstated library they update state within a container by interacting with a jsx button that is subscribed to the container. import React from 'react'; import { render } from 'react-dom'; import { Provider, Subscribe, Container } from 'unstated'; type CounterState = { count: number }; class CounterContainer extends Container<CounterState> { state = { count: 0 }; increment() { this.setState({ count: this.state.count + 1 }); } decrement() { this.setState({ count: this

Jest mock react context

对着背影说爱祢 提交于 2019-12-22 04:01:19
问题 I need some help understanding how one can test an application using React Context . Here's my sample setup. context.js import React from 'react' export const AppContext = React.createContext() App.js import React from 'react' import MyComponent from './MyComponent' import {AppContext} from './context' const App extends React.Component { state = { items: [] } handleItemAdd = newItem => { const {items} = this.state items.push(newItem) this.setState(items) } render() { return ( <AppContext