1. beforeCreate(){
  2. console.log('刚刚创建实例');
  3. },
  4. created(){
  5. console.log('实例创建完成');
  6. },
  7. beforeMount(){
  8. console.log('模板编译之前 ');
  9. },
  10. mounted(){
  11. /* 请求数据,操作Dom时常用 */
  12. console.log('实力挂载完成');
  13. },
  14. beforeUpdate(){
  15. console.log('更新前')
  16. },
  17. updated(){
  18. console.log('更新后')
  19. },
  20. beforeDestroy(){
  21. /* 页面销毁时要保存数据,可以监听这个销毁的生命周期 */
  22. console.log('实例销毁前')
  23. alert('准备销毁')
  24. },
  25. destroyed(){
  26. console.log('实力销毁后')
  27. }
  28. --------------------------------------------------------
  29. //业务中常用的Vue生命周期函数
  30. mounted(){
  31. /* 请求数据,操作Dom时常用 */
  32. console.log('实力挂载完成');
  33. },
  34. beforeDestroy(){
  35. /* 页面销毁时要保存数据,可以监听这个销毁的生命周期 */
  36. console.log('实例销毁前')
  37. alert('准备销毁')
  38. }

1、methods

是个对象,是Vue实例对象上绑定的方法,供当前Vue组件作用域内使用,未调用不会执行,
只执行逻辑,返回值可有可无,对一些数据请求,点击事件进行封装函数等。

2、creted

是个方法,在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成视图

3、monted

在模板渲染成html后调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作

4、computed

是计算属性,也可以理解为一个方法。无需再data中声明,其中计算的结果如果不发生改变就不会触发,
且必须返回一个值并在DOM中绑定的才能取得值。他可以自动获取数据的改变。

  1. <div v-for="(item,index) in adList" :key='index'>i{{item}}</div>
  2. adList() {
  3. let tmp = this.$store.state.adList;
  4. if (!tmp) {
  5. tmp = [];
  6. }
  7. return tmp;
  8. }

5、watch

监听数据变化、列如v-model的input值什么的、但是必须在data中声明

  1. watch:{
  2. dataTime(val,newVal){
  3. .......
  4. }
  5. }

6、onload

页面加载完成后触发函数html、css、js,属于js方法,一个页面只会调用一次

7、onshow

页面切换后触发,可用于切换页面刷新数据等

————————————————
原文链接:https://blog.csdn.net/W2457307263/article/details/87998201