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
Vue生命周期钩子函数加载顺序的理解的更多相关文章
- Vue生命周期 钩子函数和组件传值
Vue生命周期 钩子函数 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等. 同时在这个过程中也会运行一 ...
- 关于 vue 生命周期 钩子函数 事件
vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染->更新->渲染.卸载等一系列过程,我们称这是vue的生命周期. 通俗的将就是vue实例从创建到销毁 ...
- 对vue生命周期/钩子函数的理解
对于实现页面逻辑交互等效果,我们必须知晓vue的生命周期,才能愉快的玩耍,知道我们写的东西应该挂载到哪里,vue官方给出的api讲解的那叫一个简单啊,如下: 所有的生命周期钩子自动绑定this上下文到 ...
- vue生命周期 钩子函数
首先,1.x和2.x的生命周期钩子对比: 钩子函数的树状图,红色的是我们可以利用的函数,绿色的是函数解析,蓝色的是函数执行时机 <!DOCTYPE html> <html> & ...
- vue 生命周期钩子函数
实例中的生命周期钩子可以分为以下8种情况: beforeCreate: 实例刚被创建,vue所有属性都还不存在 created: 实例创建完成,但$el还不存在 beforeMount:挂载之前 mo ...
- vue生命周期钩子函数详解
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/qq_35585701/article/ ...
- VueRouter和Vue生命周期(钩子函数)
一.vue-router路由 1.介绍 vue-router是Vue的路由系统,用于定位资源的,在页面不刷新的情况下切换页面内容.类似于a标签,实际上在页面上展示出来的也是a标签,是锚点.router ...
- vue生命周期钩子函数
<template> <div> <h2>this is from C.vue</h2> </div> </template> ...
- vue之生命周期钩子函数之运用
一.什么是生命周期钩子函数: 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运行 ...
随机推荐
- 安全开发流程(SDL)学习概述
1.简介 SDL的全称是Security Development Lifecycle,即:安全开发生命周期.由微软最早提出,是一种专注于软件开发的安全保障流程.为实现保护最终用户为目标,它在软件开发流 ...
- Java 基础 - 泛型类/泛型方法/类型通配符'?' 的用法及栗子
笔记: /**1.定义一个PairTest泛型类, 测试泛型 类 Pair的用法 * class Pair<T>{ * private T first; * private T secon ...
- 直接插入排序Straight_Insertion_Sort
基本思想:简单排序的一种.如果玩过扑克牌应该都知道顺子,这时有一把顺子但是顺序是乱的,你要去按顺序整理.那第二张牌和第一张牌比较,调整顺序后前两张牌就是有序的,接着第三张牌插入前两张的有序列中,形成三 ...
- python-windows安装相关问题
1.python的环境配置,有些时候是没有配置的,需要在[系统环境]-[path]里添加. 2.安装pip:从官网下载pip包,然后到包目录==>python setup.py install ...
- JavaEE企业面试问题之Java基础部分
1. Java基础部分 1.1 Java中的方法覆盖(Override)和方法重载(Overload)是什么意思? 重载Overload表示同一个类中可以有多个名称相同的方法,但这些方法的参数列表各不 ...
- 模块讲解---numpymo模块,matplotlib模块,pandas模块
目录 numpy模块 matplotlib模块 pandas模块 numpy模块 numpy模块:用来做数据分析,对numpy数组(既有行又有列)--矩阵进行科学运算 在使用的时候,使用方法与其他的模 ...
- 使用Django 测试客户端一起测试视图,模板和URL
Django 测试客户端 self.client.get(url) 测试客户端是Django中TestCase类的一个属性名. 至此已经在网站中可以创建一个清单了. 那么,现在是可以在unit te ...
- python执行playbook
from collections import namedtuple from ansible.parsing.dataloader import DataLoader from ansible.va ...
- 003_FREERTOS任务基础知识
(一)任务状态 FreeRTOS 中的任务永远处于下面几个状态中的某一个: ● 运行态当一个任务正在运行时,那么就说这个任务处于运行态,处于运行态的任务就是当前正在使用处理器的任务.如果使用的是单核处 ...
- MySQLSyntaxErrorException: Table 'taotao.tbuser' doesn't exist
先看看表名是不是有下划线,再看看实体类有没有@TableName("tb_user") 逆向生成代码里添加设置