Vue组件

组件系统是 Vue 的另一个重要概念，因为它是一种抽象，允许我们使用小型、独立和通常可复用的组件构建大型应用。仔细想想，几乎任意类型的应用界面都可以抽象为一个组件树：

• 如果vue实例中对象既有el也有template，那么template的优先级大于el
  //App header aside content

//声子
let App {
}
//挂子 如果key和value一样，可以只写App
compents:{
  App:App
}
//使用子 在template中 <App></App>

*使用实例

 <script> 
    let Cat = {
      data(){
        return{

        }
      },
      template:'<div><h2>haha</h2><h2>haha</h2></div>'
    }
    let App = {
      data(){
        return{
          text:'I miss you!'
        }
      },
      template:'<div><h2>{{ text }}</h2><Cat></Cat></div> ',
      components:{
        Cat
      }
    }        
 
    new Vue({
      el:'#app',
      data (){
        return{
          msg:'what?'
        }
      },
      components:{
        App
      }
    })
    </script>

tempalte属性下一定是闭合标签

全局组件

//全局组件，第一个参数名字，第二个参数options各种属性
    //slot内容组件，由Vue提供，分发内容，全局组件不用挂子就可用
    Vue.component('Vaside',{
      data(){
        return{

        }
      },
      template:'<button><slot></slot></button>'
      

    })

Vue的生命周期

• beforeCreate
• Create 组件创建完成 主要应用：发送ajax
• beforeMount
• Mounted 渲染完成
• beforUpdate
• Update
• beforActivate
• Activate
• befordestory
• destory