vue中元件的data為什麼是乙個函式

2022-07-23 21:06:18 字數 802 閱讀 2482

元件是可復用的vue例項,乙個元件被建立好之後,就可能被用在各個地方,而元件不管被復用了多少次,元件中的data資料都應該是相互隔離,互不影響的,基於這一理念,元件每復用一次,data資料就應該被複製一次,之後,當某一處復用的地方元件內data資料被改變時,其他復用地方元件的data資料不受影響,如下面這個例子:

該元件被復用了三次,但每個復用的地方元件內的count資料相互不受影響,它們各自維護各自內部的count

能有這樣效果正是因為上述例子中的data不是乙個單純的物件,而是乙個函式返回值的形式,所以每個元件例項可以維護乙份被返回物件的獨立拷貝,如果我們將上述例子中的data修改為:

那麼就會造成無論在哪個元件裡改變了count值,都會影響到其他兩個元件裡的count

vue元件中data為什麼是個函式

在vue的開發中,我們在元件中採用函式這種格式 data 在vue例項中採用的是物件這種格式 data 那麼為什麼要在元件中採用函式的方式呢?首先元件是多次使用的,也就是復用。當我們多次呼叫乙個元件,肯定不希望元件中資料是相互聯通的。所以在此使用函式的方式return乙個物件,這樣每次呼叫元件返回的...

Vue元件中data選項為什麼必須是函式

官方解釋 data 必須是函式 構造 vue 例項時傳入的各種選項大多數都可以在元件裡使用。只有乙個例外 data 必須是函式。實際上,如果你這麼做 vue.component my component span data 那麼 vue 會停止執行,並在控制台發出警告,告訴你在元件例項中 data ...

為什麼Vue元件裡面data必須是個函式

首頁我們先了解乙個原形和原型鏈,每個js物件和js方法都有乙個原形,js物件的是隱式原形 proto,而方法中的是顯示原形prototype,下面舉個例子 export default methods 其實底層是 component.proto data 而var obj 底層是var obj ne...