el-table的show-overflow-tooltip内容过多，自定义样式

本文介绍: 【代码】el–table的show–overflow–tooltip 内容过多，自定义样式。

使用 el–popover 替换 show–overflow–tooltip，以下是代码和样式：

&lt;el-table-column prop="shareContent" label="分享内容" width="500" style="cursor: pointer"&gt;
  &lt;template slot-scope="scope"&gt;
    &lt;el-popover placement="bottom" trigger="hover"&gt;
      <template&gt;
        <div class="set-popper"&gt;{{scope.row.shareContent | contentFilter}}</div&gt;
      </template&gt;
      <div slot="reference" class="set-content"&gt;
        <span&gt;{{scope.row.shareContent | contentFilter}}</span>
      </div>
    </el-popover>
  </template>
</el-table-column>

.set-popper {
  width:500px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 12;
  -webkit-box-orient: vertical;
}
.set-content {
  cursor: default;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}