Vue学习笔记 - 组件基础

组件注册

全局注册

可在多个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>

组件的复用