How to detect a variable change in React js/Solidity?

Question

I have a number variable in my react project that changes every couple of minutes.

I would like to make a popup on the screen that displays whether or not the number increased or decreased.

I'm having trouble figuring out a way to make a function that is always running and can detect when that number variable changes.

What changes the variable? There are many ways to do it. Pass it as a prop. Put it in context. Put it in state. Have it emit an event. — ray
– ray, Commented Nov 6, 2021 at 6:14
I figured it out using useEffect(). I simply set my changing variable to a const and passed it through in [] of useEffect(). — john9
– john9, Commented Nov 7, 2021 at 23:11

Nimantha · Accepted Answer · 2021-11-09 04:08:14Z

7

If you are using functional components you can use the useEffect hook, like this

useEffect(()=>{
    //call your increment function here
},[someVariable]) //and in the array tag the state you want to watch for

the useEffect will cause a re-render when the state of 'someVariable' in the above example changes

you can see more about the hook in the react docs https://reactjs.org/docs/hooks-effect.html,

edited Nov 9, 2021 at 4:08

Nimantha

6,5376 gold badges32 silver badges78 bronze badges

answered Nov 6, 2021 at 6:28

Kirubel Eneyew

1166 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

programandoconro Over a year ago

You may want to call the alert instead of the increment function inside the useEffect, (that could actually create and infinite loop).

Kirubel Eneyew Over a year ago

Yes It could, thank you for correcting me @programandoconro , as long as the increment function updates the state for the target variable from any where it should work fine

john9 Over a year ago

@KirubelEneyew so I would have to make someVariable into a useState? the variable that's changing is a price feed that is read from a smart contract on ethereum. essentially the variable (price) changes every 3 minutes. What's the best way to use useState here?

Collectives™ on Stack Overflow

How to detect a variable change in React js/Solidity?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related