tooltip 可算修复了~ view-design 的 table 的cell.vue

就这个bug可是有年头了,可算是修复了

ViewUI/src/components/table/cell.vue

https://github.com/view-design/ViewUI/blob/master/src/components/table/cell.vue

不过高手就是高手,用的 document.createRange 进行修复的。

<template v-if="column.tooltip">
<Tooltip transfer :content="row[column.key]" :theme="column.tooltipTheme ? column.tooltipTheme : tableRoot.tooltipTheme" :disabled="!showTooltip" :max-width="column.tooltipMaxWidth ? column.tooltipMaxWidth : tableRoot.tooltipMaxWidth" class="ivu-table-cell-tooltip">
<span ref="content" @mouseenter="handleTooltipIn" class="ivu-table-cell-tooltip-content">{{ row[column.key] }}</span>
</Tooltip>
</template>
handleTooltipIn () {
const $content = this.$refs.content;
let range = document.createRange();
range.setStart($content, 0);
range.setEnd($content, $content.childNodes.length);
const rangeWidth = range.getBoundingClientRect().width;
this.showTooltip = rangeWidth > $content.offsetWidth;
range = null;
},

tooltip 可算修复了~ view-design 的 table 的cell.vue的更多相关文章

  1. ACM-计算几何之Quoit Design——hdu1007 zoj2107

    Quoit Design Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) To ...

  2. mysql下优化表和修复表命令使用说明(REPAIR TABLE和OPTIMIZE TABLE)

    随着mysql的长期使用,可以修复表来优化,优化时减少磁盘占用空间.方便备份. REPAIR TABLE `table_name` 修复表 OPTIMIZE TABLE `table_name` 优化 ...

  3. mysql下优化表和修复表命令使用说明(REPAIR TABLE和OPTIMIZE TABLE)

    REPAIR TABLE `table_name` 修复表 OPTIMIZE TABLE `table_name` 优化表 show create table tablename   表结构 REPA ...

  4. 修复mysql:[ERROR] Native table ‘performance_schema’

    转: http://www.amznz.com/error-native-table-performance_schema/ mysql数据库出现如下错误,主要是因为升级了mysql软件包,而一些数据 ...

  5. React之ant design的table表格序号连续自增

    render(text,record,index){     return(       <span>{(pagination.current-1)*10+index+1}</spa ...

  6. ant design 的Table组件固定表头时不对齐

    现在有一个表格,里面的列数是不固定的(可以重复写入数据),且列数行数都可能很多,就带来一个问题: 必须要固定表头,但是antd 的表格组件设置了固定表格 scroll={{x:1000,y:300}} ...

  7. 深入理解 Android 之 View 的绘制流程

    概述 本篇文章会从源码(基于Android 6.0)角度分析Android中View的绘制流程,侧重于对整体流程的分析,对一些难以理解的点加以重点阐述,目的是把View绘制的整个流程把握好,而对于特定 ...

  8. Android View的绘制流程

    写得太好了,本来还想自己写的,奈何肚里墨水有限,直接转吧.正所谓前人种树,后人乘凉.. View的绘制和事件处理是两个重要的主题,上一篇<图解 Android事件分发机制>已经把事件的分发 ...

  9. View绘制过程理解

    假期撸了几篇自定义View相关的东西,后两天下雨呆在家里还是效率太低Orz   每个Activity都包含一个Window对象,这个Window对象通常由PhoneWindow来实现[1],而每个Wi ...

  10. 创建一个Table View

    在本课程中,您将创建应用程序FoodTracker的主屏幕.您将创建第二个,表视图为主场景,列出了用户的菜谱.你会设计定制表格单元格显示每一个菜谱,它是这样的: 学习目标 在课程结束时,你将能够: 创 ...

随机推荐

  1. 常见的WCF面试问题

    WCF和ASMX WebService的区别是什么? 最基本的区别在于,ASMX或者ASP.NET WebService是用来通过基于HTTP的SOAP来实现通讯.但WCF可以使用任意协议(HTTP, ...

  2. JuiceFS 新手必知 24 问

    JuiceFS 是一个创新性的软件产品,很多初次尝试的小伙伴对产品和用法感到很多疑惑,所以为了帮助大家快速理解并上手 JuiceFS,我们整理了24个关于 JuiceFS 经典的问题答案,相信经过这 ...

  3. 简单总结Tomcat/SpringMVC/Spring/SpringBoot的关系

    Tomcat是一个Web应用服务器,可以作为Servlet容器.它的作用是,解析客户端client发起的request,并组装出HttpRequest.创建HttpResponse,将二者交于内部的H ...

  4. 设计模式(三十二)----综合应用-自定义Spring框架-自定义Spring IOC-自定义Spring IOC总结

    1 自定义Spring IOC总结 1.1 使用到的设计模式 工厂模式.这个使用工厂模式 + 配置文件的方式. 单例模式.Spring IOC管理的bean对象都是单例的,此处的单例不是通过构造器进行 ...

  5. IDE 不用鼠标 向下选择

  6. [Ngbatis源码学习][Spring] Spring 的资源管理 ResourceLoader

    在学习Ngbatis的源码时,看到了有关xml文件的加载,涉及到了资源的加载,对相关知识进行总结与整理. 1. 相关类 Resource AbstractResource ResourceLoader ...

  7. 致敬英雄,共悼逝者,css 让页面变黑白

    壹 ❀ 引 今天是四月四日清明节,也是全国哀悼抗疫烈士的一天.细心的同学可以发现,不仅是娱乐活动以及游戏全部停止,当我们打开各大门户网站,网站页面也都变成了黑白,那么具体怎么做呢,这里可以借用CSS3 ...

  8. NC19999 [HAOI2016]放棋子

    题目链接 题目 题目描述 给你一个N*N的矩阵,每行有一个障碍,数据保证任意两个障碍不在同一行,任意两个障碍不在同一列,要求你在这个矩阵上放N枚棋子(障碍的位置不能放棋子),要求你放N个棋子也满足每行 ...

  9. linux删除目录下指定文件方法

    1.删除当前目录下文件名含有2013的文件 ls | grep  2013 | xargs rm --To be continue...

  10. 常用Windows控制台命令

    查看网络连接信息 1.查看所有网络连接 netstat -ano -a 显示所有连接和侦听端口. -n 以数字形式显示地址和端口号. -o 显示拥有的与每个连接关联的进程 ID. 详细的使用方式使用n ...