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

2021-10-03 17:24:05 字數 591 閱讀 8339

在vue的開發中,我們在元件中採用函式這種格式

data() 

}

在vue例項中採用的是物件這種格式

data:{}
那麼為什麼要在元件中採用函式的方式呢?

首先元件是多次使用的,也就是復用。當我們多次呼叫乙個元件,肯定不希望元件中資料是相互聯通的。所以在此使用函式的方式return乙個物件,這樣每次呼叫元件返回的都是乙個新的物件,物件所處的記憶體位址是不一樣的,這樣就可以避免在實際開發中資料的聯通帶來的不變。

我們可以採用下列**來證明一下每次return的資料儲存的位址是不一樣的。

function abc()

}let a = abc()

let b = abc()

let c = abc()

a.name = '李四'

console.log(a()) //李四

console.log(b()) //張三

console.log(c()) //張三

上述描述如有問題,敬請指出相互學習~~~

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

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

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

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

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

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