Vue使用记录——细节

76 阅读1分钟

1、.sync修饰符实现父子组件的双向绑定

子组件:this.$emit('update:[prop属性]', XXXX)
父组件:
v-bind:title.sync="XXXX" // 属性值
&&
v-bind.sync="Obj" // 属性对象

2、vue的生命周期

beforeCreate: this指向确定,无法响应式
created: vue实例创建完成【接口请求,设置data】
beforeMount: 
mounted: vue实例挂在到DOM上,页面初始化
beforeUpdate:
updated:
beforeDestroy:
destroyed:
activated: <keep-alive />包裹的组件被激活时触发
deactivated: <keep-alive />包裹的组件被停用时触发

父子组件生命周期顺序:

step1: 父组件beforeCreate -> created -> beforeMount
step2: 子组件1beforeCreate -> created -> beforeMount
step3: 子组件2beforeCreate -> created -> beforeMount
step4: 子组件1mounted
step5: 子组件2mounted
step6: 父组件mounted
......更新流程【销毁流程一致】.....
stepN: 父组件beforeUpdate
stepN+1: 子组件beforeUpdate -> 子组件updated
stepN+2: 父组件updated

3、