element-ui的回调函数Events的用法详解

做轮播的时候想用这个change回调函数，但是官方文档上竟然就只列了这么一行东西，完全没有示例代码（也可能我没找到哈）

鼓捣了半天，东拼西凑终于找到了靠谱的使用方法，其实很简单

在轮播组件上加上@change=“XXX”

比如

<el-carousel indicator-position="none" arrow="never" height="550px" style="width:1300px" @change="carouselChange">

@change就是官方定义的事件名称，XXX就是你自己定义的方法名，触发change事件时就会调用你定义的方法，

而方法中自己定义的参数key1和key2则对应官方定义的回调参数（目前激活的幻灯片的索引和原幻灯片的索引）

methods: {
  carouselChange: function(key1, key2) {
   console.log(key1 + ",,,*," + key2);
  }
 }

运行看下效果

成功的触发了函数，并且获取到了两个回调参数

总结

以上所述是小编给大家介绍的element-ui的回调函数Events的用法详解，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • 浅谈ElementUI中switch回调函数change的参数问题

    需求说明 八个switch组件,用同一个回调函数 switch组件状态发生变化时需要知道它目前开关状态 需要知道当前是哪个switch 问题描述 按照官方文档对switch事件的描述 事件名称 说明 回调参数 change switch 状态发生变化时的回调函数 新状态的值 下面这样写可以满足第二个需求,change回调函数中的参数callback就是开关当前的状态值,默认是boolean类型,但是第三个需求还不能解决. <el-switch v-model="value1" @

  • element-ui的回调函数Events的用法详解

    做轮播的时候想用这个change回调函数,但是官方文档上竟然就只列了这么一行东西,完全没有示例代码(也可能我没找到哈) 鼓捣了半天,东拼西凑终于找到了靠谱的使用方法,其实很简单 在轮播组件上加上@change="XXX" 比如 <el-carousel indicator-position="none" arrow="never" height="550px" style="width:1300px"

  • JS回调函数原理与用法详解【附PHP回调函数】

    本文实例讲述了JS回调函数原理与用法.分享给大家供大家参考,具体如下: JS回调函数 何为回调函数,官方解释:当程序跑起来时,一般情况下,应用程序(application program)会时常通过API调用库里所预先备好的函数.但是有些库函数(library function)却要求应用先传给它一个函数,好在合适的时候调用,以完成目标任务.这个被传入的.后又被调用的函数就称为回调函数(callback function). 通常将一个函数B传入另一个函数A,并且在需要的时候再调用函数A. 说白

  • JS中的Replace()传入函数时的用法详解

    replace方法的语法是:stringObj.replace(rgExp, replaceText) 其中stringObj是字符串(string),reExp可以是正则表达式对象(RegExp)也可以是字符串(string),replaceText是替代查找到的字符串.. 废话不多说了,直接给大家贴代码了,具体代码如下所示: <script> var str = "a1ba2b"; var reg = /a.b/g; str = str.replace(reg,func

  • 基于Python中求和函数sum的用法详解

    基于Python中求和函数sum的用法详解 今天在看<集体编程智慧>这本书的时候,看到一段Python代码,当时是百思不得其解,总觉得是书中排版出错了,后来去了解了一下sum的用法,看了一些Python大神写的代码后才发现是自己浅薄了!特在此记录一下.书中代码段摘录如下: from math import sqrt def sim_distance(prefs, person1, person2): # 得到shared_items的列表 si = {} for item in prefs[p

  • python3中numpy函数tile的用法详解

    tile函数位于python模块 numpy.lib.shape_base中,他的功能是重复某个数组.比如tile(A,n),功能是将数组A重复n次,构成一个新的数组,我们还是使用具体的例子来说明问题:(至于为什么是在numpy.lib.shape_base中,我还是不太清楚.) 其实tile就是重复的意思,把一个数组a,当做模板,重复几次,生成另一个数组b 至于矩阵可以不以这样,还没有试过. 例子: 创建一个a,使用tile来创建b from numpy import * a=[0,1,2]

  • Python pandas中apply函数简介以及用法详解

    目录 1.基本信息 2.语法结构 3.使用案例 3.1 DataFrame使用apply 3.2 Series使用apply 3.3 其他案例 4.总结 参考链接: 1.基本信息 ​ Pandas 的 apply() 方法是用来调用一个函数(Python method),让此函数对数据对象进行批量处理.Pandas 的很多对象都可以使用 apply() 来调用函数,如 Dataframe.Series.分组对象.各种时间序列等. 2.语法结构 ​ apply() 使用时,通常放入一个 lambd

  • PHP回调函数及匿名函数概念与用法详解

    本文实例讲述了PHP回调函数及匿名函数概念与用法.分享给大家供大家参考,具体如下: 1.回调函数 PHP的回调函数其实和C.Java等语言的回调函数的作用是一模一样的,都是在主线程执行的过程中,突然跳去执行设置的回调函数: 回调函数执行完毕之后,再回到主线程处理接下来的流程 而在php调用回调函数,不想c以及java那样直接使用函数名作为函数参数,而是在php中使用函数对应的字符串名称执行 1.1.无参数回调 <?php //无参数回调 function callback(){ echo 'ex

  • jQuery.trim() 函数及trim()用法详解

    jQuery.trim()函数用于去除字符串两端的空白字符.该函数可以去除字符串开始和末尾两端的空白字符(直到遇到第一个非空白字符串为止).它会清除包括换行符.空格.制表符等常见的空白字符. 该函数属于全局的jQuery对象. 语法 jQuery 1.0 新增该静态函数. jQuery.trim( str ) 参数 描述 str String类型需要去除两端空白字符的字符串. 如果参数str不是字符串类型,该函数将自动将其转为字符串(一般调用其toString()方法).如果参数str为null

  • C++指向函数的指针用法详解

    本文以实例形式展示了C++指向函数的指针用法,是深入学习C++所必须掌握的关键知识点.分享给大家供大家参考之用.具体方法如下: 函数指针 现来看看以下声明语句,看看其含义: float (*h(int, void (*)(int)))(int); 以下是一个变量指针的定义语句: float* pf; 以下是一个普通函数的声明语句: float f(); 请看以下声明语句: float* g(); 因为()的优先级高于*, 所以相当于: float* (g()); g是一个函数, 返回值为floa

  • Vue + Element UI图片上传控件使用详解

    Vue + Element UI图片上传控件使用详解

    上一篇 Vue +Element UI +vue-quill-editor 富文本编辑器及插入图片自定义 主要是写了富文本编辑器的自定义及编辑器中图片的上传并插入到编辑内容,这篇文章单独介绍一下element UI 图片上传控件的使用.首先要安装element并中引入,安装引入过程这里不再赘述. 1.引用element 上传控件. <el-upload action="/mgr/common/imgUpload"//这里需要配置一下文件上传地址(跨域) list-type=&qu

随机推荐