會不會引發vue中的組件更新，只要抓住：組件模板的顯示結果會不會改變就行，如果顯示結果會變，那就會更新組件，否則不會引發組件更新
一、數據有沒有渲染在頁面上：
- 數據在模板（頁面）裏使用了：只要數據變了，自然會引起頁面的更新，因爲，影響了組件裏的模板顯示結果
- 數據沒有在模板（頁面）裏使用：就算數據變了，也不會引起頁面的更新，因爲，不影響組件裏的模板顯示結果
二、數據有沒有改動：
前提是，數據在模板裏使用了。
1、數據賦值了，而且賦值前後的值不一樣，引起組件的更新，因爲，影響了組件裏的模板顯示結果
2、數據賦值了，但是賦值前後的值一樣的，不會引起組件的更新，因爲，沒有影響了組件裏的模板顯示結果
運行以下代碼，點擊按鈕，看看控制檯裏的變化
<body >
<div id="app">
<p>i顯示在頁面上： {{i}}</p>
<input type="button" value="i++" @click="changeI()" >
<input type="button" value="j++" @click="changeJ()" >
<input type="button" value="改變i，但是賦值爲固定的值" @click="setI()" >
<input type="button" value="j++" @click="changeJ()" >
</div>
</body>
</html>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
let vm = new Vue({
el:'#app',
data:{
i:0,
j:0
},
methods:{
changeI(){
this.i++;//由於i顯示渲染在模板了，所以，引起了組件的更新，即調用了鉤子函數beforeUpdate
},
changeJ(){
this.j++;//由於j沒有渲染在模板上，所以，改變j不會，引起組件更新
},
setI(){
this.i=20;//給i賦值爲20，會引起組件的更新，但是如果，再次給i賦值爲20（值沒有變），則不會引起組件更新
}
},
beforeUpdate:function(){
console.log("beforeUpdate");
}
});
</script>