Stack Overflow
Stack Overflow

Questions tagged [use-effect]

Questions related to the use of 'useEffect', which is a reactjs hook.

The hook useEffect, available in React since v16.8, is used to trigger functions after component renders, either for the first time, every time, or when one of the listed dependencies changes.

This can be seen as a loose replacement for componentDidMount and componentDidUpdate, however be aware that useEffect fires after rendering, not after mounting.

Optionally, useEffect can return a function that runs on unmounting the component.

3547 questions
1
vote
1 answer

Empty innerText in UseEffect React Hook

I am having trouble understanding how useEffect works. I have a piece of code below: import React, { useState, useEffect, useLayoutEffect, useRef, createRef } from "react"; import {Link} from "react-router-dom"; import LoadingPage from…
ninja_nugget
  • 712
  • 1
  • 8
  • 19
1
vote
0 answers

callback function in useEffect caches state, even when dependency changes?

I've seen a couple of close questions, but none that really answered my question. I have the following code in React Native. # activities add/edit screen # ... const [activities, setActivities] = useState([]); useEffect(() => { const _setup…
clash
  • 427
  • 4
  • 11
1
vote
2 answers

javascript new array without duplicates

hmm.. I have tried a few things but cant get this to work... I know it should be simpler than I am making it. I want to create an array without duplicates. Can you help me? useEffect(() => { allBands.forEach(band => { …
Nick McLean
  • 601
  • 1
  • 9
  • 23
1
vote
2 answers

How to update the multiple state using useState?

I'm using the TabView from the React-Native and as the part of this i'm using the two states for two different objects as shown below. const [routes, setRoutes] = React.useState([]); const [sceneMap, setSceneMap] = React.useState({}); I'm calling…
coders
  • 719
  • 1
  • 11
  • 35
1
vote
1 answer

Calling only once two functions in useEffect

I try to call two functions in my useEffect hook import React, { useState, useEffect } from "react"; export const LocalWeather = () => { const APP_KEY = "XXX"; const [userPlace, setUserPlace] = useState([]); const [localWeather,…
Nta
  • 21
  • 2
  • 5
1
vote
1 answer

LocalStorage not updating property in state with React hooks

I'm trying to update an object property previously declared in a useState hook for form values and save it in localstorage. Everything goes well, but localstorage is saving date property empty all the time, I know that it must be because of…
McMore
  • 13
  • 1
  • 4
1
vote
2 answers

Send component new props react - Stuck

I have been stuck for a few hours now.. I am trying to send a component new props... but It wont get the new ones. Here is what happens. First the user clicks a button on the post component... It fires the function, 'add favorites' and 'addFavs'…
Nick McLean
  • 601
  • 1
  • 9
  • 23
1
vote
1 answer

How can I stop an infinite render loop if UseEffect() cannot be used in callback in React.js?

Frontend student here trying to figure out React... I just can't seem to get a hang on these hooks on React. I am trying to setState within the setArray(). This causes an infinite loop in rendering. React won't allow me to do a callback with…
rockon_d
  • 1,094
  • 2
  • 8
  • 21
1
vote
1 answer

How do I use a variable from a Const in a useEffect hook? React JS

EDIT: Your solution worked but now my dropdown doesn't show what is selected unless its selected twice, like this: Here I selected Health Care, but the dropdown still says "Select Industry" The here I selected Health Care for a second time and it…
tay
  • 13
  • 1
  • 5
1
vote
1 answer

React Hooks: How to clean event listeners?

I have a component Example in which I want to clear event listener when the local state display changes to false,display is set to true when show prop is true and vice versa. Code: const Example = ({ show, onClose }) => { const [display,…
Vinay Sharma
  • 3,291
  • 4
  • 30
  • 66
1
vote
1 answer

handling event and interchangeable state in hooks

I have this small web app which I wrote when I was studying react, of course its in Class based components As I learnt more I've decided to move over to hooks but I can't get my mind around it, imo I think class based components was more…
Ahmed Zaki
  • 23
  • 5
1
vote
1 answer

How to resolve this React Promise race condition problem

I'm having an issue where I am unable to set the state using "setPhotos" without setting up a "setTimeout()". When I console.log I get the data, but when changing the console.log(newArray) to setPhotos(newArray) the state is not updated /…
Daniel Bird
  • 11
  • 3
1
vote
1 answer

How to get Google Analytics to work with React

I'm trying to track each page but google only registers a view each time I click the refresh button. Not when iv'e routed to a new path. Anyone got an Idea on how to make this work? import React, {useEffect} from 'react'; import { BrowserRouter,…
Johnny Bravo
  • 163
  • 11
1
vote
1 answer

React: Why are these components not updated when useState changes? (components rendered after the app is mounted)

The components are rendered once the app has mounted (the reasoning is because these components need to be inserted within plain HTML that is fetched) I see that the state is changed, but the elements are just not reacting to that Is there any…
GWorking
  • 4,011
  • 10
  • 49
  • 90
1
vote
1 answer

ReactJS Too many re-renders. React limits the number of renders to prevent an infinite loop

I'm so stuck. Here is the code; const Destination = (props) => { const classes = useStyles(); const destinationUrl = props.match.params.dest_url; const [destination, setDestination] = React.useState(); useEffect(() => { if…
Kubilay Bayraktar
  • 73
  • 2
  • 10
1 2 3
…
99 100