在用element 的tab的时候发现  事件绑定没有作用

看了官网才知到内置有回掉函数

绑定的地方是 <el-tabs></el-tabs>

 <template>
<el-tabs v-model="activeName2" @tab-click="handleClick">
<el-tab-pane class="chartsPanel" label="教学质量分布" name="first-ta"></el-tab-pane>
<el-tab-pane class="chartsPanel" label="科研荣誉分布" name="second-ta"></el-tab-pane>
</el-tabs>
</template>
  export default {
name: 'chart',
data () {
return {
activeName2: 'first-ta',
}
},
methods: {
handleClick: function (tab, event) {
console.log(event)
console.log(event.target.getAttribute('id')) //获取到当前元素的id
}
}
}

elemnt UI点击事件失效,得到tab的序号的更多相关文章

  1. [转]iOS Safari 中click点击事件失效的解决办法

    iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素 ...

  2. IOS的Safari浏览器中,点击事件失效的原理及解决办法

    这里做了事件委托,简单区分一下[目标元素]和[代理元素],为后续论述理解做铺垫. [目标元素]:实际希望点击的元素,可以是任意标签. [代理元素]:代替[目标元素]触发点击事件的元素,有可能是目标元素 ...

  3. Android ListView中Item点击事件失效解决方案

    欢迎关注公众号,每天推送Android技术文章,二维码如下:(可扫描) 在平常的开发过程中,我们的ListView可能不只是简单的显示下文本或者按钮,更多的是显示复杂的布局,这样的话,我们就得自己写布 ...

  4. ListView点击事件失效(item里面有button按钮控件)解决方法

    ListView点击事件失效解决方法: 一般出现这个情况,就是你的item里面有按钮的点击事件,你的item里面有button控件,button控件是抢占焦点的,只要在你的item布局里面这样子写就可 ...

  5. ListVIew点击事件失效

    转自:http://blog.csdn.net/zhufuing/article/details/8677407 记录下自己所犯的错误,在写ListView的点击事件时OnItemClickListe ...

  6. angularJs 多文件动态上传(删除其中一个文件的时候,要么file没被删除,要么删除了之后,点击事件失效)

    <div cacModule.controller('CacScriptEditCtrl', CacScriptEditCtrl); CacScriptEditCtrl.$inject = [' ...

  7. ios移动端浏览器点击事件失效的解决方案

    点击事件失效的原因可能是因为,你用了事件代理了, 比如这样 $(document).on("click",".fd",function(){ }) 这段代码在安 ...

  8. ios h5 app avalon tap点击事件失效及点击延迟300ms问题解决方法

    1.ios h5 app avalon tap事件失效 使用MUI制作app界面,使用avalon.js渲染数据,发现在(Android上正常)ios上运行时容器div的avalon的ms-on-ta ...

  9. iOS Safari 中click点击事件失效的解决办法

    问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document  ...

随机推荐

  1. VC获取操作系统位数

    方法1,msdn 有相应的例子,代码贴出来给你看看 MSDN有相应Example! #include <windows.h> typedef BOOL (WINAPI *LPFN_ISWO ...

  2. boost::tokenizer详解

    tokenizer 库提供预定义好的四个分词对象, 其中char_delimiters_separator已弃用. 其他如下: 1. char_separator char_separator有两个构 ...

  3. 安装mongo php拓展

    下载php_mongo.dll文件 下载地址:https://s3.amazonaws.com/drivers.mongodb.org/php/index.html(注意对应版本及是否线程安全)需要注 ...

  4. <杂记>该换个背景图了

    ..当然我刚开始也是懵逼的,我有发现这里可以写css,但是还是缺个图片地址,想了想,这不是还有个相册功能吗. 那应该就是把自己要换的图片上传到相册吧. 右击图片,选择检查元素找到图片的src 如:ht ...

  5. 003_ab http压测工具

    一. ab -r -k -c 20000 -n 25000000 https://www.uuwatch.me/abtest #ab压测工具单机最大并发为20000,可以在多台机器上执行以增大并发 y ...

  6. Sublime Text 3安装Package Control快速建立html5和xhtml文档

    Sublime Text 3安装Package Control快速建立html5和xhtml文档 先关闭Sublime text 3:第1步:下载sublime_package_control-mas ...

  7. laravel sql复杂语句,原生写法----连表分组

    ### 使用了临时表.又分组又连表的感觉好难写,使用拉 ravel 但是现在越来也相信,没解决一个新的难题,自己又进步了一点点 ### 原生的sql: select user_code, realna ...

  8. 清北学堂 清北-Day3-R2-打架 (fight)

    题目描述 LYK有 \(n\) 个小朋友排成一排.第 \(i\) 个小朋友的战斗力是 $ a_i $,且他们的战斗力互不相同. 战斗力高的会打败战斗力低的. LYK想恶搞这些小朋友们,具体地,它有 \ ...

  9. springboot第一个项目【创建】

    1.new project,不勾选create from archetype,直接选择 2.next下一步 在Maven依赖管理中,唯一标识一个依赖项是由该依赖项的三个属性构成的,分别是groupId ...

  10. confluence搭建破解及汉化教程

    注:本文参考了 < confluence搭建破解及汉化教程  > 本文是在yum环境搭建好,且可用联网的前提下进行的实际操作并作记录的. 关于yum本地环境搭建可以参考此文:<Cen ...