el-popconfirm与el-tooltip同时使用

代码

                <el-popconfirm
confirmButtonText="确定"
cancelButtonText="取消"
icon="el-icon-info"
iconColor="red"
title="确定删除?"
@confirm="handleDelete(scope.row.id)"
:disabled="scope.row.builtinFlag == 1"
>
<template #reference>
<div>
<el-tooltip
class="item"
effect="dark"
content="删除"
placement="top"
:enterable="false"
>
<delete-outlined
:class="{
'xxx-btn-denger': !(scope.row.builtinFlag == 1),
'xxx-btn-disabled': scope.row.builtinFlag == 1,
}"
/>
</el-tooltip>
</div>
</template>
</el-popconfirm>

问题:

1、popconfirm 的触发元素是 必须有一层 div,否则达不到效果

  

element中 popconfirm与tooltip同时使用的更多相关文章

  1. ExtJS学习--------Ext.Element中的经常使用事件和其它重要的方法学习(实例)

    经常使用事件: 其它重要方法: 详细实例:(实例结果能够将相应的代码取消凝视进行測试) Ext.onReady(function(){ Ext.create('Ext.panel.Panel',{ t ...

  2. 关于使用element中的popup问题

    高产似母猪..写完上篇看了几集新番就空虚了..零点时分决定爬起来,趁着清明假期能写多写点. 1.前言 我们知道弹出框都是在触发了某种条件后展示,而一个个的新的弹出框的展示,总是覆盖着上一个弹出框.实现 ...

  3. element中的分页

    在template <template> <div class="Terminal" v-loading="loading"> < ...

  4. js实现element中可清空的输入框(2)

    接着上一篇的:js实现element中可清空的输入框(1)继续优化,感兴趣的可以去看看哟,直通车链接:https://www.cnblogs.com/qcq0703/p/14450001.html 实 ...

  5. Element中Tree树结构组件中实现Ctrl和Shift多选

    在Element中的树结构中, 实现多选功能,首先的是判断有没有按下键盘ctrl和shift按键.但是在Element中的tree组件的左键点击事件是没有提供$event鼠标属性判断的.所以就需要在函 ...

  6. 关于【bootstrap】中,【tooltip】的不算bug的bug的个人看法

    先说下遇到这个问题的背景吧. 就是在页面中有个div,这个div右上角(或者其他位置)有个 × 的图标(这个图标添加tooltip工具提示),光标移到这个图标时,触发tooltip,提示“点击移除”这 ...

  7. 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑

    eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...

  8. Extjs 在Grid单元中格添加Tooltip提示

    Grid 中的单元格添加Tooltip 的效果 Ext.QuickTips.init(); //必须要… columns: [ { text: 'Name', dataIndex: 'name' }, ...

  9. 你知道element中el-table的列名中不能含有" . "吗?

    [本文出自天外归云的博客园] Vue+element比较流行,但是element有个坑,就是element的表格列名中不能含有点儿" . ",否则数据都显示不出来. 在elemen ...

  10. element中文件上传

    vue+element 文件操作 作者:一粒尘土 时间:2019-3-17 注:以下操作针对 vue-cli 目录 使用 组件常用参数 组件常用方法 上传文件 上传文件格式限制 回显文件 下载文件 删 ...

随机推荐

  1. 常见非指纹built-in函数

    unescape unescape() _函数_可对通过 escape() 编码的字符串进行解码. unescape("abcdefg") 'abcdefg' unescape(& ...

  2. java 进阶P-6.2+P-6.3

    细胞自动机 CellularAutomation(细胞自动机)细胞自动机(英语:Cellular automaton),又称格状自动机.元胞自动机,是一种离散模型,在可算性理论.数学及理论生物学都有相 ...

  3. JVM参数:带你认识-X和-XX参数

    摘要:JVM参数分为三类:标准参数.非标准参数(-X参数)和高级选项(-XX参数).本文主要为大家讲解-X参数和-XX参数. 本文分享自华为云社区<JVM运行参数之-X和-XX参数>,作者 ...

  4. Grafana 系列文章(十一):Loki 中的标签如何使日志查询更快更方便

    ️URL: https://grafana.com/blog/2020/04/21/how-labels-in-loki-can-make-log-queries-faster-and-easier/ ...

  5. react 高效高质量搭建后台系统 系列 —— 表格的封装

    其他章节请看: react 高效高质量搭建后台系统 系列 表格 有一种页面在后台系统中比较常见:页面分上下两部分,上部分是 input.select.时间等查询项,下部分是查询项对应的表格数据.包含增 ...

  6. DataGrid 设置某列可见或只读

    在ASP.NET中使用 DataGrid数据展示控件时,可以对数据进行展示,编辑,删除,在有些时候不希望某列被修改,进行如下设置 点击编辑后 想要如下效果  其中权限编码和权限分类不希望修改 设置方法 ...

  7. 删除resource中的图片后编译报错

    同僚的一篇文章是:https://www.cnblogs.com/jljxxf/archive/2012/08/19/2646937.html, 详细介绍了C#的Resources,其中关于删除资源这 ...

  8. RocketMQ - 消费者启动机制

    RocketMQ客户端中有两个独立的消费者实现类:org.apache.rocketmq.client.consumer.DefaultMQPullConsumer 和 org.apache.rock ...

  9. Vulhub 漏洞学习之:Aria2

    Vulhub 漏洞学习之:Aria2 目录 Vulhub 漏洞学习之:Aria2 1 Aria2 任意文件写入漏洞 1.1 漏洞利用 1 Aria2 任意文件写入漏洞 Aria2是一个命令行下轻量级. ...

  10. ES6中的class对象和它的家人们

    在ES6中新增了一个很重要的特性: class(类).作为一个在2015年就出了的特性, 相信很多小伙伴对class并不陌生.但是在日常开发中使用class的频率感觉并不高(可能仅限于作者),感觉对c ...