Home > front end >  Rounding the setState React is synchronous or asynchronous?
Rounding the setState React is synchronous or asynchronous?

Time:10-17

When it comes to React, will have to mention the React in one of the most important API method -- setState, setState is often used in the React of an API, but it exists some problems often leads to beginners, the core reason is because the API is asynchronous,
But actually setState have synchronous execution, if setState appear in our custom dom events and setTimeout code, are actually setState synchronization:
 
BodyClick=()=& gt; {
Enclosing setState ({
Count: this state. The count + 1,
)}
The console. The log (this. State. The count);//in theory, we immediately after setState printing is not the latest but here can get + 1 after the count, the code is executed simultaneously,
}
ComponentWillMount () {
Document. The body. The addEventListener (' click ', enclosing bodyClick);
SetTimeout ()=& gt; {
Enclosing setState ({
Count: this state. The count + 1,
)}
The console. The log (this. State. The count);//in theory, we immediately after setState printing is not the latest but here can get + 1 after the count, the code is executed simultaneously,
})
}

To explore setState see here don't confused, in fact, if the implementation of the way you will find this kind of situation is not surprising that setState actually is the react specifically designed as a way of the realization of the asynchronous, the purpose is to avoid frequent rendering dom (such as continuous multiple calls setState would merge, we would say) behind, is actually setState asynchronous or synchronous execution, the react within a judgment standard, this standard is to determine executive setState code, whether in a batch update status, whether isBatchingUpdates activated:
setState main process
  • Related