Vue生命周期函数

<script>
    var vm=new Vue({
        el:'#root',
        data:{
        title:'hello'
    },
        selfX:0,
        selfFoo:()=>{
            console.log(0)
        }
        beforeCreate()//最早的一个钩子，实例初始化事件与LifeCycle后进行，可以访问this，但不可以访问data，可访问dom元素，但不会被渲染
        {
            //console.log('this') yes
            //console.log(this.title) no
            //console.log(document.querySelector('root'))//yes 但是模板不会被渲染
            //this.x=100 yes 可用于添加属性
        },
    	created()//初始化响应式数据与依赖后执行
    	{
            //console.log(this) yes
			//console.log(this.title) yes
            //console.log(document.querySelector('root'))  yes 但是模板还没被渲染
            //可用于data里数据的修改 this.tltle = 'world'
        },
        beforeMount()
    	{
			//console.log(this) yes
			//console.log(this.title) yes
            //console.log(document.querySelector('root'))  yes 但是模板还没被渲染
        },
        mounted(){
			//console.log(this) yes
			//console.log(this.title) yes
            //console.log(document.querySelector('root'))  yes 
            //一般在第一次页面渲染完毕后的工作都在这里完成
            setTimeout(()=>{
                this.tltle='world'
            },5000)//yes
            //ajax请求一般在mounted或者created里面
        },
        beforeUpdate(){//
            console.logdocument.querySelector('root')
        },
        updated(){//渲染之后进行的数据更新才会触发
			console.logdocument.querySelector('root')
            setInterval(()=>{
                this.title = new Date().getTime()
            },1000)
			this.title = new Date().getTime()//死循环
        },
        /*当mount中有销毁组件(渲染完毕之后销毁组件)才会触发以下函数*/
        beforeDestroy(){
            
        },
        destroyed(){
            
        }
    	//但是清理之后，页面仍会显示组件，但是DOM中已经不存在这个组件
    })
</script>