1. 程式人生 > >new Vue() 和 export default {}

new Vue() 和 export default {}

Vue 是什麼? po 主的理解是 Vue 就是一個建構函式,生成的例項是一個巨大的物件,可以包含資料、模板、掛載元素、方法、生命週期鉤子等選項。

所以渲染的時候,可以使用構造 Vue 例項的方式來渲染相應的 html 頁面:

new Vue({
    el: '#app'
    ...
})

那麼 export default {} 又是來幹嘛的?

這是在複用元件的時候用到的。假設我們寫了一個單頁面元件 A 檔案,而在另一個檔案 B 裡面需要用到它,那麼就要用 ES6 的 import/export 語法 ,在檔案 A 中定義輸出介面 export ,在檔案 B 中引入 import

,然後再生成一個 Vue 例項 new Vue (**),把引入的元件用起來,這樣就可以複用元件 A 去配合檔案 B 生成 html 頁面了。

所以在複用元件的時候,export 和 new Vue 缺一不可。