vue元件註冊方式

2021-10-05 12:02:38 字數 1112 閱讀 9808

3,擴充套件例項

**:

vue.component('tag-name',{})
var child = 

new vue(

})

vue中,new vue({})與export default {} 兩者的區別?

new vue({}) 只在入口檔案 main.js裡使用,而其餘元件的裡的屬性和方法的使用,為什麼都要放在export default{}中,而不是每個元件都用new vue({})來生成呢?

放在export default{}中它是作為乙個class被匯出的麼?

另外兩者的寫法也不一樣。就data來說,給作為new vue的引數,它是物件。如:

new vue(

})

而在 export default中,它就成了方法,這是為什麼呢?

export default       

};

},

components:

};

1 & 2: **

export default 的是乙個物件 object,然後父元件通過 components 屬性註冊,其實是內部呼叫了

vue.extend 方法,把這個 object 傳入,然後得到的也是乙個 vue 的例項。

**為啥用 vue.extend 而不是直接new vue,因為他們要建立父子關係,形成乙個 vue 的元件樹。

3. 元件裡的 data 必須是乙個方法,因為元件是多個例項,如果 data 是乙個同乙個 object,那麼乙個元件的修改會影響另乙個,因此它必須返回乙個方法。

// 定義乙個混合物件

var mymixin = ,

methods:

}}// 定義乙個使用混合物件的元件

var component = vue.extend()

var component = new component() // -> "hello from mixin!"

vue元件一直註冊不了 Vue 元件註冊方式

寫在前面 無論是 vue 還是 react,都有元件的概念。元件,顧名思義就是能和別人組合在一起的物件。在前端頁面開發過程中,將乙個頁面劃分成乙個個小的模組,每個模組單獨定義,每個模組就是乙個元件。元件還可以進行復用,a 頁面和 b 頁面有乙個相似的模組,可以抽離成乙個可區域性修改的元件。元件化的概...

Vue元件註冊

方式一 vue.component my component name 方式二 vue.component mycomponentname 方式一 在dom中可以直接用,是有效的元素 方式二 可用在單檔案元件中 single file component 元件註冊後,可在全域性使用,並且全域性元件之...

vue元件註冊

我們會在多個頁面使用button,每個頁面寫起來很麻煩,如果想把它做成乙個公用元件,使用時直接呼叫會比較方便。現在建立了乙個元件button.vue。找到main.js檔案,然後輸入如下 import button from components button.vue vue.component m...