这个方法适用于 获取数据更新之后的dom 在dom渲染完成后执行
如果一个组件 被注册到了父组件中 如果 子组件写了v-if 则 v-if 一旦变为true 是无法执行组件里的任何方法的 必须通过this。$next 第一此变为true 是无法拿到子组件里的任何属性和方法的
this.$next的执行顺序 不管你监听不见听 父元素的 create beformount 的先执行 然后 子元素声明周期 在父元素的mount 在然后 子元素的监听 在子元素的 生命周期 函数里的console 一定比next执行快
子元素的监听 console打印信息还是比声明周期快的
created(){
this.obj.name="create"
this.$nextTick(()=>{
console.log("parent111111111111111111111")
})
console.log('888888888888888888create')
},
beforeMount(){
console.log(this.$el,'before')
this.obj.name="beforemount"
this.$nextTick(()=>{
console.log("parent22222222222")
})
console.log('888888888888888888beforemount')
},
mounted(){
console.log(this.$el)
this.obj.name="mounted"
this.$nextTick(()=>{
console.log("parent333333333333")
})
console.log('888888888888888888mounted')
}
son
objs:{
handler(){
console.log(this.objs.name)
this.$nextTick(()=>{
console.log("son1111111111111111")
})
},
deep:true,
immediate:true
}
},
methods: {
},
beforeCreate () {
// console.log(this.age,'mmnnn')
},
created () {
console.log("soncreate")
this.$nextTick(()=>{
console.log('bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbson22')
})
},
mounted () {
console.log("sonmounter")
this.$nextTick(()=>{
console.log('bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbson333')
})
888888888888888888create
ceshi.vue?0737:88 undefined 'before'
ceshi.vue?0737:93 888888888888888888beforemount
ceshi2.vue?c7f3:56 beforemount
ceshi2.vue?c7f3:82 soncreate
ceshi2.vue?c7f3:88 sonmounter
ceshi.vue?0737:97 <div data-v-4475b032 data-v-7ba5bd90 class="q">…</div>
ceshi.vue?0737:102 888888888888888888mounted
ceshi.vue?0737:82 parent111111111111111111111
ceshi.vue?0737:91 parent22222222222
ceshi2.vue?c7f3:58 son1111111111111111
ceshi2.vue?c7f3:84 bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbson22
ceshi2.vue?c7f3:90 bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbson333
ceshi2.vue?c7f3:56 mounted
ceshi.vue?0737:100 parent333333333333
ceshi2.vue?c7f3:58 son1111111111111111