码迷,mamicode.com
首页 > 其他好文 > 详细

vue2.0组件的生命周期

时间:2017-09-08 10:05:30      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:for   upd   length   dom   let   gettime   update   text   .text   

 beforeCreate(){
console.log(new Date().getTime())
let data = this.text;
console.log(‘组件创立之前‘)
console.log(‘beforeCreate‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘beforeCreate‘, $(‘.study‘).length ? "dom获取成功" : ‘dom获取失败‘);
},
created(){
console.log(new Date().getTime())
console.log(‘组件实例创建完成‘)
let data = this.text;
console.log(‘created‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘created‘, $(‘.study‘).length ? " dom获取成功" : ‘dom获取失败‘);
//初次加载时不在 数据改变再次渲染是dom存在
},
beforeMount(){
console.log(new Date().getTime())
console.log(‘组件编译挂载之前‘)
let data = this.text;
console.log(‘beforeMount‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘beforeMount‘, $(‘.study‘).length ? "dom获取成功" : ‘dom获取失败‘);
// console.log($ele.demo)

},
mounted(){
console.log(new Date().getTime())
console.log(‘组件编译挂载之后‘)
let data = this.text;
console.log(‘mounted‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘mounted‘, $(‘.study‘).length ? "dom获取成功" : ‘dom获取失败‘);

},
beforeUpdate(){
console.log(new Date().getTime())
console.log(‘组件更新之前‘)
let data = this.text;
console.log(‘beforeUpdate‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘beforeUpdate‘, $(‘.study‘).length ? "dom获取成功" : ‘dom获取失败‘);
},
updated(){
console.log(new Date().getTime())
console.log(‘组件更新之后‘)
let data = this.text;
console.log(‘updated‘, data ? "数据获取成功" : ‘数据获取失败‘);
console.log(‘updated‘, $(‘.study‘).length ? "dom获取成功" : ‘dom获取失败‘);
},
activated(){
// 跳路由的时候
/*写于当前组件内*/
console.log(‘组件激活时调用‘)
},
deactivated(){
console.log(‘组件被移除时调用‘)
},

vue2.0组件的生命周期

标签:for   upd   length   dom   let   gettime   update   text   .text   

原文地址:http://www.cnblogs.com/aqigogogo/p/7492795.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!