Vue组件基础

Vue 组件

• 声明组件

Vue.component('hello-world', {
    data() {
        return {

        }
    },
    template: '
Hello World
'
})


    

组件也是 Vue 的实例，也具有 data、methods、computed、created 等函数和生命周期钩子，唯一的区别是，组件没有 el 属性。

• 组件复用

    
    
    


Vue.component('hello-world', {
    data() {
        return {
            count: 0
        }
    },
    template: '
Hello World{{count}}
'
})

Vue 组件的组织方式

Vue组件树