Can I be sure that the next time React renders it will use the most recent state value?What is the difference between state and props in React?Can you force a React component to rerender without calling setState?When to use React setState callbackWill setState inside componentWillReceiveProps run before render?React this.setState will be queued properly?Prevent this.state to be used with setStateDoes React batch state update functions when using hooks?How do react hooks determine the component that they are for?React Hooks function component with controlled rendering based on state/prop valuesHow to make sure a React state using useState() hook has been updated?
Would Disciple of Life supercharge Regenerate?
What are some bad ways to subvert tropes?
Do I need to be legally qualified to install a Hive smart thermostat?
Is this standard Japanese employment negotiations, or am I missing something?
How do I iterate equal values with the standard library?
Is it possible to spoof an IP address to an exact number?
What is this arch-and-tower near a road?
How to supply water to a coastal desert town with no rain and no freshwater aquifers?
Taking advantage when the HR forgets to communicate the rules
Sleepy tired vs physically tired
Are "confidant" and "confident" homophones?
How to play a D major chord lower than the open E major chord on guitar?
How do I check that users don't write down their passwords?
Curve fitting when data has a sharp initial slope and then tapers off
Taking my Ph.D. advisor out for dinner after graduation
Do intermediate subdomains need to exist?
PhD: When to quit and move on?
When is one 'Ready' to make Original Contributions to Mathematics?
Is there a name for non-Benders in the Avatar universe?
Is conquering your neighbors to fight a greater enemy a valid strategy?
Is it acceptable that I plot a time-series figure with years increasing from right to left?
Who is responsible for exterminating cockroaches in house - tenant or landlord?
What instances can be solved today by modern solvers (pure LP)?
Why do we need a bootloader separate from our application program in microcontrollers?
Can I be sure that the next time React renders it will use the most recent state value?
What is the difference between state and props in React?Can you force a React component to rerender without calling setState?When to use React setState callbackWill setState inside componentWillReceiveProps run before render?React this.setState will be queued properly?Prevent this.state to be used with setStateDoes React batch state update functions when using hooks?How do react hooks determine the component that they are for?React Hooks function component with controlled rendering based on state/prop valuesHow to make sure a React state using useState() hook has been updated?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
There are lots of places in the React docs where it says that a React may enqueue a batch of state changes and do them all the once later.
React Component Docs
setState() enqueues changes to the component state and tells React
that this component and its children need to be re-rendered with the
updated state. This is the primary method you use to update the user
interface in response to event handlers and server responses.
Think of setState() as a request rather than an immediate command to
update the component. For better perceived performance, React may
delay it, and then update several components in a single pass. React
does not guarantee that the state changes are applied immediately.
setState() does not always immediately update the component. It may
batch or defer the update until later. This makes reading this.state
right after calling setState() a potential pitfall. Instead, use
componentDidUpdate or a setState callback (setState(updater,
callback)), either of which are guaranteed to fire after the update
has been applied. If you need to set the state based on the previous
state, read about the updater argument below.
React Hooks API Reference
Basic Hooks - useState
const [state, setState] = useState(initialState);
Returns a stateful value, and a function to update it.
During the initial render, the returned state (state) is the same as
the value passed as the first argument (initialState).
The setState function is used to update the state. It accepts a new
state value and enqueues a re-render of the component.
QUESTION 1
My question is: regardless of how many state updates React decides to enqueue to perform on a single batch, can I rely on the fact the next render will use the most current state with all the updated that were queued since the last render?
QUESTION 2
Can I rely on the order of those state changes that React decides to queue? I mean, If I setState(a:1) and then setState(a:2) can I be sure that the final value of my state will be 2 ?
reactjs react-hooks
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
add a comment |
There are lots of places in the React docs where it says that a React may enqueue a batch of state changes and do them all the once later.
React Component Docs
setState() enqueues changes to the component state and tells React
that this component and its children need to be re-rendered with the
updated state. This is the primary method you use to update the user
interface in response to event handlers and server responses.
Think of setState() as a request rather than an immediate command to
update the component. For better perceived performance, React may
delay it, and then update several components in a single pass. React
does not guarantee that the state changes are applied immediately.
setState() does not always immediately update the component. It may
batch or defer the update until later. This makes reading this.state
right after calling setState() a potential pitfall. Instead, use
componentDidUpdate or a setState callback (setState(updater,
callback)), either of which are guaranteed to fire after the update
has been applied. If you need to set the state based on the previous
state, read about the updater argument below.
React Hooks API Reference
Basic Hooks - useState
const [state, setState] = useState(initialState);
Returns a stateful value, and a function to update it.
During the initial render, the returned state (state) is the same as
the value passed as the first argument (initialState).
The setState function is used to update the state. It accepts a new
state value and enqueues a re-render of the component.
QUESTION 1
My question is: regardless of how many state updates React decides to enqueue to perform on a single batch, can I rely on the fact the next render will use the most current state with all the updated that were queued since the last render?
QUESTION 2
Can I rely on the order of those state changes that React decides to queue? I mean, If I setState(a:1) and then setState(a:2) can I be sure that the final value of my state will be 2 ?
reactjs react-hooks
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37
add a comment |
There are lots of places in the React docs where it says that a React may enqueue a batch of state changes and do them all the once later.
React Component Docs
setState() enqueues changes to the component state and tells React
that this component and its children need to be re-rendered with the
updated state. This is the primary method you use to update the user
interface in response to event handlers and server responses.
Think of setState() as a request rather than an immediate command to
update the component. For better perceived performance, React may
delay it, and then update several components in a single pass. React
does not guarantee that the state changes are applied immediately.
setState() does not always immediately update the component. It may
batch or defer the update until later. This makes reading this.state
right after calling setState() a potential pitfall. Instead, use
componentDidUpdate or a setState callback (setState(updater,
callback)), either of which are guaranteed to fire after the update
has been applied. If you need to set the state based on the previous
state, read about the updater argument below.
React Hooks API Reference
Basic Hooks - useState
const [state, setState] = useState(initialState);
Returns a stateful value, and a function to update it.
During the initial render, the returned state (state) is the same as
the value passed as the first argument (initialState).
The setState function is used to update the state. It accepts a new
state value and enqueues a re-render of the component.
QUESTION 1
My question is: regardless of how many state updates React decides to enqueue to perform on a single batch, can I rely on the fact the next render will use the most current state with all the updated that were queued since the last render?
QUESTION 2
Can I rely on the order of those state changes that React decides to queue? I mean, If I setState(a:1) and then setState(a:2) can I be sure that the final value of my state will be 2 ?
reactjs react-hooks
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
There are lots of places in the React docs where it says that a React may enqueue a batch of state changes and do them all the once later.
React Component Docs
setState() enqueues changes to the component state and tells React
that this component and its children need to be re-rendered with the
updated state. This is the primary method you use to update the user
interface in response to event handlers and server responses.
Think of setState() as a request rather than an immediate command to
update the component. For better perceived performance, React may
delay it, and then update several components in a single pass. React
does not guarantee that the state changes are applied immediately.
setState() does not always immediately update the component. It may
batch or defer the update until later. This makes reading this.state
right after calling setState() a potential pitfall. Instead, use
componentDidUpdate or a setState callback (setState(updater,
callback)), either of which are guaranteed to fire after the update
has been applied. If you need to set the state based on the previous
state, read about the updater argument below.
React Hooks API Reference
Basic Hooks - useState
const [state, setState] = useState(initialState);
Returns a stateful value, and a function to update it.
During the initial render, the returned state (state) is the same as
the value passed as the first argument (initialState).
The setState function is used to update the state. It accepts a new
state value and enqueues a re-render of the component.
QUESTION 1
My question is: regardless of how many state updates React decides to enqueue to perform on a single batch, can I rely on the fact the next render will use the most current state with all the updated that were queued since the last render?
QUESTION 2
Can I rely on the order of those state changes that React decides to queue? I mean, If I setState(a:1) and then setState(a:2) can I be sure that the final value of my state will be 2 ?
reactjs react-hooks
reactjs react-hooks
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
asked Mar 25 at 19:36
cbdev420cbdev420
1,9064 silver badges27 bronze badges
1,9064 silver badges27 bronze badges
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37
add a comment |
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37
add a comment |
1 Answer
1
active
oldest
votes
Question 1: No, React can render (for instance) only half of the update queue, and THEN the other.
Question 2: Yes. The order in which the updates are processed might not be as simple as the the order you call setState in, but in the end, the insertion order is what determines the lastest version of your state.
Detailed explaination in the react code.
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
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
);
);
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
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55345231%2fcan-i-be-sure-that-the-next-time-react-renders-it-will-use-the-most-recent-state%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Question 1: No, React can render (for instance) only half of the update queue, and THEN the other.
Question 2: Yes. The order in which the updates are processed might not be as simple as the the order you call setState in, but in the end, the insertion order is what determines the lastest version of your state.
Detailed explaination in the react code.
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
add a comment |
Question 1: No, React can render (for instance) only half of the update queue, and THEN the other.
Question 2: Yes. The order in which the updates are processed might not be as simple as the the order you call setState in, but in the end, the insertion order is what determines the lastest version of your state.
Detailed explaination in the react code.
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
add a comment |
Question 1: No, React can render (for instance) only half of the update queue, and THEN the other.
Question 2: Yes. The order in which the updates are processed might not be as simple as the the order you call setState in, but in the end, the insertion order is what determines the lastest version of your state.
Detailed explaination in the react code.
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
Question 1: No, React can render (for instance) only half of the update queue, and THEN the other.
Question 2: Yes. The order in which the updates are processed might not be as simple as the the order you call setState in, but in the end, the insertion order is what determines the lastest version of your state.
Detailed explaination in the react code.
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
answered Mar 25 at 22:03
Bear-FootBear-Foot
3831 silver badge10 bronze badges
3831 silver badge10 bronze badges
add a comment |
add a comment |
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
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
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55345231%2fcan-i-be-sure-that-the-next-time-react-renders-it-will-use-the-most-recent-state%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
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
Required, but never shown
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
Required, but never shown
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
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
interesting questions, from my own experience if you execute your setState synchronously then the next time it renders all the states will be new.
– duc mai
Mar 25 at 20:37