Vue中組件的data選項


一個組件的 data 選項必須是一個函數

data: function () {
  return {
    count: 0
  }
}

如果data是一個函數的話,這樣每復用一次組件,就會返回一份新的data,類似於給每個組件實例創建一個私有的數據空間,讓各個組件實例維護各自的數據。而單純的寫成對象形式,就使得所有組件實例共用了一份data,就會造成一個變了全都會變的結果。

所以說vue組件的data必須是函數。這都是因為js的特性帶來的,跟vue本身設計無關。
因為在JS 中只有函數才存在作用域,data是一個函數時,每個組件實例都有自己的作用域,每個實例相互獨立,不會相互影響,也叫閉包!!

js本身的面向對象編程也是基於原型鏈和構造函數,應該會注意原型鏈上添加一般都是一個函數方法而不會去添加一個對象了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM