起于昨晚大半夜在群里看到有人問(wèn)這個(gè)問(wèn)題，在子組件的data屬性里重新賦值props屬性 this.a = this.propA，不生效！

提示了他如果是異步的話，就要注意watch.決定今日敲個(gè)demo分析一下過(guò)程。

官方文中中其實(shí)有提到，用計(jì)算屬性。父組件值傳入子組件，一個(gè)單向數(shù)據(jù)流，如果是重新把prop的屬性值賦值給了子組件的其他data屬性，需要用計(jì)算屬性。

會(huì)刷新值的前提是沒(méi)有去做重新賦值給子組件的其他data屬性，那么這個(gè)props其實(shí)相當(dāng)于在子組件中就是響應(yīng)式變量，一旦變化會(huì)觸發(fā)更新！

但是，如果在子組件中props的屬性重新賦值給了data的另外一個(gè)屬性，這時(shí)候其實(shí)相當(dāng)于賦值了固定的值給某屬性。

上圖中,父組件傳的值是propA，初始值傳個(gè)1，定時(shí)器2秒鐘后再去改變propA的值，然后子組件3秒后，a的值肯定是不會(huì)再變的。

如果父組件傳的該值是異步的情況下，子組件對(duì)應(yīng)的該值也是變化了的，但由于你是在初始化時(shí)候賦值給了其他，意思是想要其他的屬性替代這個(gè)props的屬性，

這個(gè)操作，其實(shí)是切斷了響應(yīng)式關(guān)聯(lián)的，關(guān)于響應(yīng)式，文檔中的深入響應(yīng)式原理也有提到：

上述的this.a = this.propA，這個(gè)重新賦值，propA這個(gè)值在父組件變化并傳遞到子組件中后，對(duì)于this.a并不能監(jiān)測(cè)到變化，

this.a = this.propA其實(shí)相當(dāng)于this .a = 3,那么propA變化了，a是不可能也跟著變的。因?yàn)镻ropA的監(jiān)察者以及setter、getter跟a屬性的setter是毫無(wú)關(guān)聯(lián)的。

所以解決方式是通過(guò)監(jiān)聽(tīng)或者計(jì)算屬性，可以watch propA的變化，然后手動(dòng)去更新a的值。這樣才能做到視圖同步變化！

轉(zhuǎn)載于:https://www.cnblogs.com/hjj2ldq/p/9413529.html

總結(jié)

以上是生活随笔為你收集整理的关于props的注意事项！的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。