Vue生态圈

element中table组件内容过长时显示tooltip

2018-11-21  本文已影响65人  知足常乐晨

show-overflow-tooltip

true:当内容过长被隐藏时显示 tooltip
false:默认值

<el-table-column label="文件路径" prop="filePath" align="center" width="220" show-overflow-tooltip=true>
</el-table-column>

也可以结合el-popover组件自己来实现

    <el-table-column label="文件路径" prop="filePath" align="center" width="220">
          <template slot-scope="scope">
            <el-popover placement="top-start" title="文件路径" width="250" trigger="hover" >
              <div>{{scope.row.filePath}}</div>
                <span slot="reference">{{ scope.row.filePath.substr(0,30)+'...' }}</span>
            </el-popover>
          </template>
    </el-table-column>
上一篇 下一篇

猜你喜欢

热点阅读