element中 popconfirm与tooltip同时使用
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同时使用的更多相关文章
- ExtJS学习--------Ext.Element中的经常使用事件和其它重要的方法学习(实例)
经常使用事件: 其它重要方法: 详细实例:(实例结果能够将相应的代码取消凝视进行測试) Ext.onReady(function(){ Ext.create('Ext.panel.Panel',{ t ...
- 关于使用element中的popup问题
高产似母猪..写完上篇看了几集新番就空虚了..零点时分决定爬起来,趁着清明假期能写多写点. 1.前言 我们知道弹出框都是在触发了某种条件后展示,而一个个的新的弹出框的展示,总是覆盖着上一个弹出框.实现 ...
- element中的分页
在template <template> <div class="Terminal" v-loading="loading"> < ...
- js实现element中可清空的输入框(2)
接着上一篇的:js实现element中可清空的输入框(1)继续优化,感兴趣的可以去看看哟,直通车链接:https://www.cnblogs.com/qcq0703/p/14450001.html 实 ...
- Element中Tree树结构组件中实现Ctrl和Shift多选
在Element中的树结构中, 实现多选功能,首先的是判断有没有按下键盘ctrl和shift按键.但是在Element中的tree组件的左键点击事件是没有提供$event鼠标属性判断的.所以就需要在函 ...
- 关于【bootstrap】中,【tooltip】的不算bug的bug的个人看法
先说下遇到这个问题的背景吧. 就是在页面中有个div,这个div右上角(或者其他位置)有个 × 的图标(这个图标添加tooltip工具提示),光标移到这个图标时,触发tooltip,提示“点击移除”这 ...
- 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑
eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...
- Extjs 在Grid单元中格添加Tooltip提示
Grid 中的单元格添加Tooltip 的效果 Ext.QuickTips.init(); //必须要… columns: [ { text: 'Name', dataIndex: 'name' }, ...
- 你知道element中el-table的列名中不能含有" . "吗?
[本文出自天外归云的博客园] Vue+element比较流行,但是element有个坑,就是element的表格列名中不能含有点儿" . ",否则数据都显示不出来. 在elemen ...
- element中文件上传
vue+element 文件操作 作者:一粒尘土 时间:2019-3-17 注:以下操作针对 vue-cli 目录 使用 组件常用参数 组件常用方法 上传文件 上传文件格式限制 回显文件 下载文件 删 ...
随机推荐
- FLASH-CH32F103替换STM32F103 FLASH快速编程移植说明
因CH32F103 相对于STM32F103 flash 操作多了快速编程模式,该文档说明主要目的是为了方便客户在原先ST 工程的基础上实现flash 快速编程模式的快速移植. 1.在stm32f10 ...
- .Net7运行模型之托管Main函数的调用
前言: .Net7的CLR最具特色的一个地方,就是运行模型.因为它主宰了整个CLR的运行过程. 又因为其庞大的代码量,有的几十万行甚至百万行.所以理解起来非常不容易.本篇拆分来看下,里面一个细节Mai ...
- Mybatis数据库批量操作
1:新增 首先,Mysql插入一条记录返回主键对Mybatis版本要求低,而批量插入返回带主键的,需要升级到3.3.1 以及以上的版本. 1.1:Mysql 上图需要注意加入useGenerate ...
- TCP与UDP、socket模块
1.传输层之TCP与UDP协议 1.TCP协议 1.传输控制协议(也称为TCP协议或可靠协议)是为了在不可靠的互联网络上提供可靠的端到端字节流而专门设计的一个传输协议,(数据不容易丢失);造成数据不容 ...
- 重学SpringBoot. step5 再学SpringMVC
SpringMVC 参考:<深入浅出 SpringBoot 2.X> 虽然说的是SpringBoot,但把SpringMVC将的很好,正是SpringMVC应用到SpringBoot中非常 ...
- Vue23 ref属性
1 简介 在js中,我们获取一个元素可以通过document.getElementById()去获取,在vue中,使用了ref属性来替代id,通过ref属性可以获取html元素以及vue组件实例对象 ...
- mysql19-锁
1.什么是锁 锁是计算机协调多个进程或线程并发访问某一资源的机制.在数据库中,除传统的计算资源(如CPU.RAM.I/O等)的争用以外,数据也是一种供许多用户共享的资源.如何保证数据并发访问的一致性. ...
- 为什么sleeping的会话会造成阻塞
背景 客户反映HIS数据库每天22点后都会发生阻塞,阻塞的源头是一个sleeping的会话,越阻塞越多,只能通过手动KILL掉才能解决,十分不解为什么状态为sleeping的会话会造成阻塞. 现象 在 ...
- ubuntu卸载eigen
1.sudo updatedb 2.locate eigen3 3.手动删除
- 编写FailServlet和SuccessServlet类
@WebServlet("/successServlet") public class SuccessServlet extends HttpServlet { protected ...