這個問題很有意思 因為平時我們一般問題異步和同步指的是 數(shù)據(jù)請求 同步和異步問題
這里加上了組件 還有修改data 這里給大家寫個例子
<body>
<div id="app">
<div id="main">{{num}}</div>
<button @click="add">更新</button>
</div>
</body>
<script>
new Vue({
el:"#app",
data:{
num:10
},
methods:{
add(){
this.num++;
console.log(this.num)//11
console.log(document.getElementById("main").innerHTML);//10
}
}
})
</script>
以此可以說明
數(shù)據(jù)更新是同步的 但是視圖更新是異步的
解決這個問題需要使用 $nextTick 解決視圖異步更新的問題