首页 > 其他分享 > :show-overflow-tooltip="true" 当文字超过3000时,鼠标移上去,闪屏

:show-overflow-tooltip="true" 当文字超过3000时,鼠标移上去,闪屏

时间:2022-09-02 18:01:52浏览次数:48  
标签:show color 移上去 tooltip errorWord scope row

1:代码

        <el-table-column label="错误词" prop="errorWord" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.errorWord && scope.row.errorWord.length > 10">
              <el-popover
                placement="top-start"
                title=""
                width="800"
                trigger="hover"
                popper-class="workorder-problem-desc"
              >
                <div>{{ scope.row.errorWord }}</div>
                <span slot="reference">
                  {{ scope.row.errorWord.substr(0, 10) + "..." }}
                </span>
              </el-popover>
            </span>
            <span v-else>{{ scope.row.errorWord }}</span>
          </template>
        </el-table-column>

2:样式

.workorder-problem-desc {
  background-color: #303133;
  color: #fff;
  border-color: #303133;
}

 

3:展示

 

标签:show,color,移上去,tooltip,errorWord,scope,row
From: https://www.cnblogs.com/guohanting/p/16650805.html

相关文章

  • showdoc 重启和启动命令
    showdoc重启和启动命令:showdoc启动命令:dockerrun-d--nameshowdoc-p8080:80-v/showdoc_data/html:/var/www/html/star7th/showdoc问题解决:docker:Error......
  • CTFSHOW Web266
    highlight_file(__FILE__);include('flag.php');$cs=file_get_contents('php://input');classctfshow{public$username='xxxxxx';public$password='xxxxxx'......
  • vue3 基础-条件渲染 v-if 和 v-show
    本篇讲vue中对dom元素节点进行"显示和隐藏"的实现方式指令,即v-if和v-show.其实一句话就能说明白,v-if的底层是从dom树中增删节点;而v-show的底层是"di......
  • Echats给柱状图上方数字加%及鼠标移上去悬浮标签数据后加%
    1、Echats给柱状图上方数字加%     完整示例:在series的label标签的,添加1formatter:function(params){//标签内容2returnparams.......
  • ctfshow 萌新web系列--4
    <html><head><title>ctf.show萌新计划web1</title><metacharset="utf-8"></head><body><?php#包含数据库连接文件include("config.php");#判断get提......
  • ctfshow 萌新web系列--3
    <html><head><title>ctf.show萌新计划web1</title><metacharset="utf-8"></head><body><?php#包含数据库连接文件include("config.php");#判断get提......
  • CTFSHOW Web259 SoapClient原生类的反序列化
      index.php   看到该题目第一眼,大脑直接一个简单的想法就是通过访问flag.php添加X-Forwarded-For然后POST发送token数据。但!在本题的环境当中,由于使用了Clou......
  • ctfshow 萌新web系列--2
    <html><head><title>ctf.show萌新计划web1</title><metacharset="utf-8"></head><body><?php#包含数据库连接文件include("config.php");#判断get提......
  • ctfshow 萌新web系列--1
    打开靶机 <html><head><title>ctf.show萌新计划web1</title><metacharset="utf-8"></head><body><?php#包含数据库连接文件include("config.php");......
  • vue表格之:summary-method="getSummaries"与show-summary(列求和)
    //表格列求和<el-table:summary-method="getSummaries"show-summary></el-table>getSummaries(param){const{columns,data}=paramconstsums=[]......