FLIP Systematic introduction: vue
- Date
-
Takasaki Chidori
TL;DR
After changing the data, use nextTick to get the new dom value.
A FLIP demo of vue3
When we change some reactive variables, Vue.js automatically updates the dom, but this update is not instantaneous. For example, when we set current.value = v, it triggers re-render, the div inside the ol will be changed.
How do we know this rendering is over and the Paint has not yet begun? Vue.js provides a function to solve this problem: nextTick.
After it ,we get a new dom, then we can gets some properties such as position and transparency.
Further, we can continue the flip steps(invert and play) like those before.
Click "Rock" or "Jazz" to see how the menu bar changes.