Ufdjrw

How to denote matrix elements succinctly?

Rivers without rain

bldc motor, esc and battery draw, nominal vs peak

Can an Area of Effect spell cast outside a Prismatic Wall extend inside it?

Elements that can bond to themselves?

Minor Revision with suggestion of an alternative proof by reviewer

What's the polite way to say "I need to urinate"?

How do I deal with a coworker that keeps asking to make small superficial changes to a report, and it is seriously triggering my anxiety?

What happened to Captain America in Endgame?

Who was the lone kid in the line of people at the lake at the end of Avengers: Endgame?

Are there physical dangers to preparing a prepared piano?

Critique of timeline aesthetic

How to have a sharp product image?

Does a large simulator bay have standard public address announcements?

Did the BCPL programming language support floats?

How does Captain America channel this power?

Is there any official lore on the Far Realm?

How exactly does Hawking radiation decrease the mass of black holes?

Constructions of PRF (Pseudo Random Function)

'It addicted me, with one taste.' Can 'addict' be used transitively?

How do I reattach a shelf to the wall when it ripped out of the wall?

Coordinate my way to the name of the (video) game

I preordered a game on my Xbox while on the home screen of my friend's account. Which of us owns the game?

Why did some of my point & shoot film photos come back with one third light white or orange?

React hooks useEffect only on update?

ReactJS Two components communicatingLoop inside React JSXReact js onClick can't pass value to methodCan you force a React component to rerender without calling setState?Programmatically navigate using react routerHow to conditionally add attributes to React components?Infinite loop in useEffectHow to call loading function with React useEffect only onceReact Hooks - useEffect fires even though the state did not changereact hooks useEffect() cleanup for only componentWillUnmount?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

4

3

If we want to restrict useEffect to run only when the component mounts, we can add second parameter of useEffect with [].

useEffect(() => 
 // ...
, []);

But how can we make useEffect to run only when the moment when the component is updated except initial mount?

reactjs react-hooks

share|improve this question

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

add a comment | 

4

3

If we want to restrict useEffect to run only when the component mounts, we can add second parameter of useEffect with [].

useEffect(() => 
 // ...
, []);

But how can we make useEffect to run only when the moment when the component is updated except initial mount?

reactjs react-hooks

share|improve this question

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

add a comment | 

If we want to restrict useEffect to run only when the component mounts, we can add second parameter of useEffect with [].

useEffect(() => 
 // ...
, []);

But how can we make useEffect to run only when the moment when the component is updated except initial mount?

reactjs react-hooks

share|improve this question

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

useEffect(() => 
 // ...
, []);

share|improve this question

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

share|improve this question

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

edited Mar 12 at 11:36

Shubham Khatri

98.5k15128167

asked Mar 9 at 8:53

kookoo

36814

asked Mar 9 at 8:53

kookoo

36814

1 Answer
1

active

oldest

votes

5

If you want to run the useEffect to run only on updates except initial mount, you can make use of useRef to keep track of initialMount with useEffect without the second parameter.

const isInitialMount = useRef(true);

useEffect(() => 
 if (isInitialMount.current) 
 isInitialMount.current = false;
 else 
 // Your useEffect code here to be run on update
 
);

share|improve this answer

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I thought that useRef can only be used to DOM manipulation. thanks!
  
  – koo
  Mar 9 at 15:02
  

  
  
  
  


• 
  
  
  

  
  3
  

  
  
  
  
  
  

  
  
  very clever solution
  
  – Mohamed Tajjiou
  Mar 12 at 11:32
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55075604%2freact-hooks-useeffect-only-on-update%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

5

If you want to run the useEffect to run only on updates except initial mount, you can make use of useRef to keep track of initialMount with useEffect without the second parameter.

const isInitialMount = useRef(true);

useEffect(() => 
 if (isInitialMount.current) 
 isInitialMount.current = false;
 else 
 // Your useEffect code here to be run on update
 
);

share|improve this answer

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I thought that useRef can only be used to DOM manipulation. thanks!
  
  – koo
  Mar 9 at 15:02
  

  
  
  
  


• 
  
  
  

  
  3
  

  
  
  
  
  
  

  
  
  very clever solution
  
  – Mohamed Tajjiou
  Mar 12 at 11:32
  

  
  
  
  

add a comment | 

5

If you want to run the useEffect to run only on updates except initial mount, you can make use of useRef to keep track of initialMount with useEffect without the second parameter.

const isInitialMount = useRef(true);

useEffect(() => 
 if (isInitialMount.current) 
 isInitialMount.current = false;
 else 
 // Your useEffect code here to be run on update
 
);

share|improve this answer

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I thought that useRef can only be used to DOM manipulation. thanks!
  
  – koo
  Mar 9 at 15:02
  

  
  
  
  


• 
  
  
  

  
  3
  

  
  
  
  
  
  

  
  
  very clever solution
  
  – Mohamed Tajjiou
  Mar 12 at 11:32
  

  
  
  
  

add a comment | 

If you want to run the useEffect to run only on updates except initial mount, you can make use of useRef to keep track of initialMount with useEffect without the second parameter.

const isInitialMount = useRef(true);

useEffect(() => 
 if (isInitialMount.current) 
 isInitialMount.current = false;
 else 
 // Your useEffect code here to be run on update
 
);

share|improve this answer

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

const isInitialMount = useRef(true);

useEffect(() => 
 if (isInitialMount.current) 
 isInitialMount.current = false;
 else 
 // Your useEffect code here to be run on update
 
);

share|improve this answer

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

edited Apr 1 at 13:28

Chris

31.3k126385

edited Apr 1 at 13:28

Chris

31.3k126385

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167

answered Mar 9 at 9:21

Shubham KhatriShubham Khatri

98.5k15128167