vue--钩子函数1
最近在学习自定义指令,这里做个整理
vue允许注册自定义指令,在2.0中,代码复用和抽象的主要形式是组件。然而有的情况下仍需要对普通DOM元素进行底层操作,这时就会用到自定义指令。
全局指令directive,局部指令directives
一个指令定义对象可以提供的钩子函数:
bind:只调用一次,指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。
inserted:被绑定元素插入父节点时调用 (仅保证父节点存在,但不一定已被插入文档中)。
update:所在组件的 VNode 更新时调用,但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变,也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新 (详细的钩子函数参数见下)。
componentUpdated
:指令所在组件的 VNode 及其子 VNode 全部更新后调用。
unbind:只调用一次,指令与元素解绑时调用。
钩子函数参数
el:指令所绑定的元素,可以用来直接操作 DOM;
binding:一个对象,包含以下属性:
name: 指令名,不包括 v- 前缀
value:指令的绑定值,
expression:字符串形式的指令表达式
VNode:Vue 编译生成的虚拟节点
这是这两天了解到的指令/钩子函数/钩子函数参数,以后或许会有更新
今天主要的疑问是不太了解update这个函数的使用
vue--钩子函数1的更多相关文章
- vue 钩子函数 使用async await
示例: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...
- Vue钩子函数生命周期实例详解
vue生命周期简介 Vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染→更新→渲染.卸载等一系列过程,我们称这是Vue的生命周期.通俗说就是Vue实例从创建到销毁 ...
- Vue钩子函数
Vue的生命周期函数 beforeCreate:function(){ console.log('1-beforeCreate 初始化之后'); }, created:function(){ cons ...
- vue 钩子函数的使用
1.什么是自定义指令,有哪些钩子函数及自定义指令的使用场景 ①自定义指令是什么?以及自定义指令的使用场景 在Vue中,有很多内置指令,但是这些指令只能满足我们最基础的使用,当我们在实际项目中遇到了必须 ...
- vue 钩子函数的初接触
vue-router的路由钩子函数: 第一种:全局钩子函数. router.beforeEach((to, from, next) => { console.log('beforeEach') ...
- vue 钩子函数
beforeRouteEnter 方法名称: beforeRouteEnter 调用时机: 切换路由之前,调用该方法时,页面还没有切换 next调用时机: activated 之后 注意事项: thi ...
- vue钩子函数的妙用之“created()和activated()”
一.created() 在创建vue对象时,当html渲染之前就触发: 但是注意,全局vue.js不强制刷新或者重启时只创建一次, 也就是说,created()只会触发一次: 二.activated( ...
- vue 钩子函数中获取不到DOM节点
原文链接:https://jingyan.baidu.com/article/f96699bbfe9c9d894f3c1b4b.html 两种解决方案: 1:官方解决方案: 受到 HTML 本身的一些 ...
- VUE钩子函数created与mounted区别
created:在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成视图. mounted:在模板渲染成html后调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作.
- Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]
前言 说到Vue的钩子函数,可能很多人只停留在一些很简单常用的钩子(created,mounted),而且对于里面的区别,什么时候该用什么钩子,并没有仔细的去研究过,且Vue的生命周期在面试中也算是比 ...
随机推荐
- PrototypePattern(23种设计模式之一)
设计模式六大原则(1):单一职责原则 设计模式六大原则(2):里氏替换原则 设计模式六大原则(3):依赖倒置原则 设计模式六大原则(4):接口隔离原则 设计模式六大原则(5):迪米特法则 设计模式六大 ...
- 100198H Royal Federation
传送门 题目大意 国家有N个城市,任意城市可以到达任意城市,是一棵树.国王要给这些城市分省份.每个省份最少M个城市,最多3M个城市.每个省有一个首府,首府不一定是这个省的城市,只是首府到这个省各个城市 ...
- Inheritance with EF Code First: Part 3 – Table per Concrete Type (TPC)
Inheritance with EF Code First: Part 3 – Table per Concrete Type (TPC) This is the third (and last) ...
- 什么是DMZ、DMZ端口、DMZ主机?
DMZ是英文“demilitarized zone”的缩写,中文名称为“隔离区”,也称“非军事化区”.它是为了解决安装防火墙后外部网络不能访问内部网络服务器的问题,而设立的一个非安全系统与安全系统之间 ...
- (树)判断二叉树是否为BST
题目:判断一颗二叉树是否为BST. 思路:其实这个问题可以有多个解决方法. 方法一:递归解决.根据BST的特性.左边的小于根节点的值,右边的大于根节点的值.并且对于每一棵子树都是如此.所以我们可以直接 ...
- WPF开源界面库
WPF开源项目 WPF有很多优秀的开源项目,我以为大家都知道,结果,问了很多人,其实他们不知道.唉,太可惜了! 先介绍两个比较牛逼的界面库 1.MaterialDesignInXamlToolkit ...
- 删除XML文档中某节点
前几天Insus.NET在写了一系列XML文档进行操作.创建 <怎样创建XML文档> http://www.cnblogs.com/insus/p/3276944.html & ...
- SGML DTD
最近处理SGML文档时,碰到的DTD语法: <!ELEMENT name - - (#PCDATA)> 说明:- - 代表 name 元素有开始标识和结束标识 <!ELEMENT ...
- Go语言学习教程:xorm表基本操作及高级操作
在上节内容中,我们介绍了xorm框架表结构的映射规则和表结构的操作.本节课,继续来深入学习表结构基本操作和高级查询的相关功能. 表结构基本操作 对表结构的操作最常见的操作是查询和统计相关的方法,我们首 ...
- python for i in range(n,m)注意...
for i in range(n,m) 区间包含n不含m