組件註冊

全局註冊

可在多個vue實例中使用

<div id="app">
    <my-component></my-component>
</div>
<script>
Vue.component('my-component', {
    template: '<div>這是一個組件</div>'
})
new Vue({
    el: '#app'
})
</script>

局部註冊

局部組件 需要在實例配合components

<div id="app">
    <my-component></my-component>
</div>
<script>
var componentA = {
    template: '<div>這是局部組件</div>'
}
new Vue({
    el: '#app',
    // 引入局部組件
    components: {
        'my-component': componentA
    }
})
</script>
 

組件的復用

Vue學習筆記 - 組件基礎