效果：

使用show-overflow-tooltip無法設定hover狀態時的樣式，改用el-tooltip

1、

      <el-table-column label="核心使用場景" min-width='300'>
        <template scope="scope">
          <el-tooltip effect="dark" placement="top">
            <div v-html="scope.row.useScene" slot="content" style="{width:'220px';white-space:pre-line;word-break:break-all;}"
 
></div>
            <div class="oneLine">{{scope.row.useScene}}</div>
          </el-tooltip>
        </template>
      </el-table-column>

2、

    async getList() {
      let res = await getList(this.listQuery)
      if (res.code === 200) {
        let { list, recordcount } 
 
= res.data
        list.forEach((item) => {
          item.updatetime = parseTime(
            Number(item.updatetime + '000'),
            '{y}-{m}-{d} {h}:{i}:{s}'
          )
          item.useScene = item.casescenelist
            .map((item) => `${item.typename}：${item.content}\n\n`)
            .join('')
            .slice(0, -2
 
)
        })
        this.tableData = list
        this.total = recordcount
      }
    },

3、

    .oneLine {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }