element Transfer 穿梭框 内容太长显示不全,鼠标移动上去显示全部

element Transfer中文字太长会造成显示不全,然后加了个提示
在这里插入图片描述

我这边是加了个插槽的形式,根据长度判断的,这个有个弊端就是如果是手机号的话,可能会没有省略号,然后也会有个黑色的提示框

          <el-transfer
          filterable :data="data" :props="{
                key: 'key',
                label: 'label',
              }">
            <template slot-scope="{ option }">
                <el-tooltip class="item" v-if="option.label.length > 6" effect="dark" :content="option.label" placement="top" >
                  <span>{
  { option.label }}</span>
                </el-tooltip>
                <span v-else>{
  { option.label }}</span>
              </template>
            </el-transfer>

相关推荐

  1. WPF 实现Popup在最上层显示、随窗口移动

    2023-12-12 14:38:05       38 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-12 14:38:05       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-12 14:38:05       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-12 14:38:05       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-12 14:38:05       18 阅读

热门阅读

  1. 一文带你了解状态机思维

    2023-12-12 14:38:05       42 阅读
  2. 互联网商业史--1.3Q大战

    2023-12-12 14:38:05       35 阅读
  3. 数据库常见的锁

    2023-12-12 14:38:05       33 阅读
  4. 有了 webapi 后 webService 被淘汰了吗?

    2023-12-12 14:38:05       35 阅读
  5. ES6-import后是否有{}的区别

    2023-12-12 14:38:05       26 阅读
  6. 排序算法——选择排序

    2023-12-12 14:38:05       39 阅读
  7. oh-my-zsh 安装和配置

    2023-12-12 14:38:05       32 阅读
  8. Runtime

    Runtime

    2023-12-12 14:38:05      25 阅读