凭inserted是vue元素插入父节点后的钩子函数吗?

在学习Vue中涉及到钩子函数,通过查阅相关的资料,得知这个概念并不是Vue独有的,而是Windows消息处理机制的一部分,当某事件触发的时候,系统自动捕获它,并作出一些操作,程序员可以通过设置函数内容,实现目标功能
1.bind:当指令被绑定到元素上时,即执行bind函数一次
4.unbinded:元素取消绑定时,执行函数

钩子函数的桉树:钩子函数有两个参数:
1.el,它是原生js对象,表示指令绑定的元素id,它拥有DOM属性
2.binding,它是一个对象,用于获取调用指令时传入的参数,包含以下属性:

  • name:表示该指令的名称
  • value:表示传入参数的值,如果传入表达式,则value为表达式的值
  • expression:表示传入的字符串,如果传入表达式,则expression为表达式组成的字符串
  • arg:表示传入指令的参数

el 和 binding都是形参,可以改变它的名称,但是用法不变

自定义指令其实就是对普通 DOM 元素进行底层操作

自定义指令就是 v-xxx

自定义指定的钩子函数: 在不同的时机可以触发不同的钩子,如bind(){} 是指令绑定到元素上的时候会触发


 自定义指令的几个参数:具体看官网搜索自定义指令


 自定义指令案例:

(1)在input被插入到父元素时候,触发inserted钩子

(2)在数据改变(比如这里是双击的时候,双击的时候data中某个值变了)的时候让其聚焦,就用到了componentUpdated钩子

 上面是做一个的聚焦,input在循环里面,是有多个input的,我们要想做的更完美,只会给当前符合条件的才执行聚焦,而不是每个都去做,在钩子函数中,binding的value(也就是v-focus的值)为true的话,才让其聚焦


 2. 注册一个自定义指令,让input或者h1等标签,使用这个指令配置颜色显示出效果


函数工作流(FunctionGraph)是一项基于事件驱动的函数托管计算服务。通过函数工作流,只需编写业务函数代码并设置运行的条件,无需配置和管理服务器等基础设施,函数以弹性、免运维、高可靠的方式运行。此外,按函数实际执行资源计费,不执行不产生费用

函数前100万次/月调用免费

VUE 钩子函数超详细解析

提交成功!非常感谢您的反馈,我们会继续努力做到更好 反馈提交失败!请稍后重试!

我要回帖

更多关于 keepalive 钩子函数 的文章

 

随机推荐