生命周期 组件

                       生命周期

        1.又名:生命周期函数 生命周期回调函数 生命周期钩子

        2.是什么 Vue在关键时刻帮我们调用的一些特殊名称的函数

        3.生命周期函数的名字不可更改 但函数的具体内容是程序员根据需求编写的

        4.生命周期函数中的this指向是vm或组件实例对象

        beforeCreate 在实例初始化之后、进行数据侦听和事件/侦听器的配置之前同步调用

       created 在实例创建完成后被立即同步调用

         beforeMount 在挂载开始之前被调用

      Mounted 在实例挂载完成后被调用

      beforeUpdate 在数据发生改变后

     Updated 在数据更改导致的虚拟DOM 重新渲染和更新完毕之后被调用

      beforeUnmount  在卸载组件实例之前调用

     Unmounted    卸载组件实例后调用

      Activated        被 keep-alive 缓存的组件激时调用

      Deactivated      被 keep-alive 缓存的组件失活时调用

      errorCaptured  在捕获一个来自后代组件的错误时被调用

                    组件

如何注册组件

        1.局部注册 靠new Vue的时候传入components选项

        2.全局注册 靠 Vue.component('组件名',组件)

        编写组件标签

           student是组件名

//创建student组件

const student = Vue.extend({

    // el:"#root",      //一定不要写配置项  因为最终组件是谁需要 谁使用

    template:`

   

       

学生姓名称 {{studentName}}

       

学生年龄 {{age}}

   

`,

    data(){

        return {

         studentName:'张三',

          age:18  

        }}})

 组件标签

        第一种写法  

        第二种写法  

        不使用脚手架时  会导致后续组件不能渲染

        一个简写方式

        const School = Vue.extend(options)   可简写为 const School = options

 关于VueComponent

        1.school组件本质是一个名为VueComponent的构造函数 且不是程序员定义的 是Vue.extend生成的

        2.我们只需要写 或 Vue解析时会帮我们创建school组建的实例对象

        即Vue帮我们执行的 new VueCompoent(options)

        3.每次调用Vue.extend 返回的都是一个全新的VueCompoent

        4.关于this指向

        1.组件配置

        data函数 methods中的函数 watch函数 computed中的函数 他们的this均是VueCompoent

        2.new Vue(options)配置中

         data函数 methods中的函数 watch函数 computed中的函数 他们的this均是Vue实例对象

        5. VueCompoent