為了能在模板中使用，這些組件必須先注冊以便 Vue 能夠識別。這里有兩種組件的注冊類型：全局注冊和局部注冊。至此，我們的組件都只是通過Vue.component全局注冊的：Vue.component('component-name', {

// ... options ...

})

該組件名Vue.component就是的第一個參數。

注冊分為全局注冊和局部注冊：

1.全局注冊：

全局注冊的組件可以用在其被注冊之后的任何 (通過new Vuew({ })) 新創建的 Vue 根實例，也包括其組件樹中的所有子組件的模板中。

Vue.component("jishuqi",{

data:function () {

return {

count:0

}

},

template:'點擊了{{count}}次'

})Vue.component("jishuqi2",{})

Vue.component("jishuqi3",{})

Vue.component("jishuqi4",{})var v=new Vue({

el:"#pp"

})

2.局部注冊

全局注冊往往是不夠理想的。比如，如果你使用一個像 webpack 這樣的構建系統，全局注冊所有的組件意味著即便你已經不再使用一個組件了，它仍然會被包含在你最終的構建結果中。這造成了用戶下載的 JavaScript 的無謂的增加。var ComponentA = { /* ... */ }

var ComponentB = { /* ... */ }

var ComponentC = { /* ... */ }然后在conponents選項中定義你想要使用的組件：new Vue({

el: '#app'

components: {

'jishuqi1': Jishuqi1,

'jishuqi2': Jishuqi2,

'jishuqi3': Jishuqi3

}

})

對于components對象中的每個屬性來說，其屬性名就是自定義元素的名字，其屬性值就是這個組件的選項對象。

注意局部注冊的組件在其子組件中不可用。

如果你希望 Jishuqi1在 Jishuqi2中可用，則你需要這樣寫：var Jishuqi1 = { /* ... */ }

var Jishuqi2 = {

components: {

'jishuqi1': Jishuqi1

},

// ...

}

本文來源于網絡：查看?>https://blog.csdn.net/yang__k/article/details/80336769

總結

以上是生活随笔為你收集整理的vue组件一直注册不了_Vue自定义组件及组件的注册方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。