zoukankan      html  css  js  c++  java
  • Vue生命周期钩子函数加载顺序的理解

    Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期。

    created:html加载完成之前,执行。执行顺序:父组件-子组件

    mounted:html加载完成后执行。执行顺序:子组件-父组件

    methods:事件方法执行

    watch:watch是去监听一个值的变化,然后执行相对应的函数。

    computed:computed是计算属性,也就是依赖其它的属性计算所得出最后的值

    export default {
         name: "draw",
         data(){      // 定义变量source        
           return {
             source:new ol.source.Vector({wrapX: false}),
    
           }
         },
        props:{ //接收父组件传递过来的参数
          map:{
            //type:String
          },
    
        },
    
    mounted(){   //页面初始化方法
        if (map==map){
    
        }
        var vector = new ol.layer.Vector({
          source: this.source
        });
        this.map.addLayer(vector);
    
      },
      watch: {   //监听值变化:map值
        map:function () {
          console.log('3333'+this.map);
          //return this.map
          console.log('444444'+this.map);
    
          var vector = new ol.layer.Vector({
            source: this.source
          });
          this.map.addLayer(vector);
        }
      },
      methods:{   //监听方法  click事件等,执行drawFeatures方法
           drawFeatures:function(drawType){}
    }

    vue中created、mounted等方法整理  https://blog.csdn.net/liudoris/article/details/80255311

  • 相关阅读:
    FastApi 进阶
    flask为多个接口添加同一个拦截器的方法
    记一次flask上传文件返回200前端却504的问题
    Python在项目外更改项目内引用
    go mod 拉取私有仓库
    go跳出多层循环的几种方式
    Zap简单使用
    记一次Goroutine与wg导致的问题
    go判断字符串是否是IP地址
    SpringBoot的启动流程
  • 原文地址:https://www.cnblogs.com/shy1766IT/p/11013919.html
Copyright © 2011-2022 走看看