首页 > 其他分享 >$nextTick函数的用法以及全局事件总线

$nextTick函数的用法以及全局事件总线

时间:2023-10-03 18:45:06浏览次数:35  
标签:nextTick 里面 函数 自定义 总线 用法 事件 组件

全局事件总线的目的是可以实现任意组件之间的通信。

这里需要涉及到原型链的知识。在Vue里面,我们知道运行一个完整的项目是由若干个VueComponents组件和一个AppVueComponent组件加上一个Vue的实例对象

而vc组件在通过this去获取属性的值时,首先会从vc实例对象里面找,没有的话就去vc的原型对象里面找,再找不到的话就会去Vue的原型对象里面找,最后才是Object的原型对象里面找

而要想实现通信,只需要如下的代码

 beforeCreate是生命周期的钩子函数,在实例化vue之前给Vue的原型对象里面创建一个$bus属性,然后其他的组件之间要想传递数据就可以使用自定义事件去完成,示例如下:

这里我想从Search组件向List组件传数据,我需要在List组件里面给公交车绑定一个getUsers的自定义事件,后面是事件触发的回调函数,那么该如何触发自定义事件呢

 我们在Seach组件里面通过$emit这个函数去触发自定义事件,后面传递回调函数所需要的参数,因为回调函数是在List组件里面执行的,因此就实现了兄弟组件之间的数据传递。

其次我要说一个很重要的函数,叫做$nextTick函数

 这里有一个handleEdit函数,当点击按钮时会触发这个事件,我们发现这个函数里面涉及有关data操作数据的代码,我们知道当data发生改变,就会重新调用虚拟Dom对比算法,

然后重新渲染页面,但是handleEdit函数里面的所有修改值的操作会在里面的代码全部执行完毕才会渲染页面。因此如果里面设计到input标签的获取焦点事件时,不去使用$nextTick函数,

那么这个获取焦点的函数相当于没执行,因此我们可以调用这个函数,也就是说渲染完毕页面之后才执行这个代码,既然都渲染完毕了,那一定可以获取到dom元素,也就可以获取焦点了。

标签:nextTick,里面,函数,自定义,总线,用法,事件,组件
From: https://www.cnblogs.com/laohei114514/p/17741469.html

相关文章

  • Pytorch nn.Linear的基本用法与原理详解
    Pytorchnn.Linear的基本用法与原理详解原文:Pytorchnn.Linear的基本用法与原理详解_iioSnail的博客-CSDN博客nn.Linear的基本定义nn.Linear定义一个神经网络的线性层,方法签名如下:torch.nn.Linear(in_features,#输入的神经元个数out_features,#输出神经元个数......
  • Go语言中泛型的一个用法
    typeOperationWithData[Tany]func()(T,error)typeOperationfunc()errorfunc(oOperation)withEmptyData()OperationWithData[struct{}]{ returnfunc()(struct{},error){ returnstruct{}{},o() }}这段Go代码定义了两种类型:Operation和OperationWit......
  • Java的HashMap用法
    一、HashMap了解HashMap是Java中常用的集合类之一,它实现了Map接口并继承自AbstractMap类。HashMap使用哈希表来存储键值对,通过将键映射为哈希码来进行高效的插入、查找和删除操作。以下是HashMap的常见用法和特点:键值对:HashMap允许存储任意类型的键和值。可以通过键来查......
  • JavaScript高级技巧:深入探索JavaScript语言的高级特性和用法
    当我们谈论JavaScript高级技巧时,以下是一些示例来说明这些概念:闭包(Closures):functionouterFunction(){varouterVariable='Hello';functioninnerFunction(){console.log(outerVariable);}returninnerFunction;}varmyFunction=outerFunction();myFu......
  • mysql中find_in_set()函数的使用及in()用法详解
    MySQL手册中find_in_set函数的语法解释:FIND_IN_SET(str,strlist)str要查询的字符串strlist字段名参数以”,”分隔如(1,2,6,8,10,22)查询字段(strlist)中包含(str)的结果,返回结果为null或记录假如字符串str在由N个子链组成的字符串列表strlist中,则返回值的范围在1到N之间......
  • mysql中find_in_set()函数的使用及in()用法详解
    MySQL手册中find_in_set函数的语法解释:FIND_IN_SET(str,strlist)str要查询的字符串strlist字段名参数以”,”分隔如(1,2,6,8,10,22)查询字段(strlist)中包含(str)的结果,返回结果为null或记录假如字符串str在由N个子链组成的字符串列表strlist中,则返回值的范围在1到N之间......
  • 如何查找python对象或类的父类子类以及用法
    一个类其方法和数据的来源可以是自定义,也可以是继承自各级父类。通过dir查看其方法和属性,通过help查看其使用方法。特别地,可通过Base和subclass寻找其父类和其他子类。亦可通过文档研究其继承关系。文档不仅包含自身类,也包括其父类的属性方法。  python>>>help(op("/projec......
  • 在k8s中使用secret存储敏感数据与四种用法
    当需要存储敏感数据时可以使用,secret会以密文的方式存储数据。创建secret的四种方法(1)通过--from-literal#每个--from-literal对应一个信息条目kubectlcreatesecretgenericmysecret--from-literal=username=admin--from-literal=password=123456(2)通过--from-file#每个文件内......
  • 企业服务总线
    企业服务总线(EnterpriseServiceBus,ESB)是由中间件技术实现并支持SOA的一组基础架构,支持异构环境中的服务、消息以及基于事件的交互,并且具有适当的服务级别和可管理性。通过使用ESB,可以在几乎不更改代码的情况下,以一种无缝的非侵入方式使企业已有的系统具有全新的服务接口,并能够......
  • C# MessageBox用法小结
    【函数】<整型>MessageBox(<字符串>Text,<字符串>Title,<整型>nType,MessageBoxIcon);【函数说明】弹出一个消息框。【语法】参数:Text<字符串>,消息框的正文;Title<字符串>,消息框的标题;nType<整型>,消息框的类型。返回值:<整型>,用户在消息框上点击关闭时的选择的按钮。MessageB......