给elementUI的table表的某一列添加文字提示（tooltip）

要实现的需求是单元格内会有多个DOM，DOM文本依次上下排列，超出单元格宽度用省略号代替，鼠标滑过显示所有文本的内容，如下图所示：

解决方案如下图所示：

代码如下：

<el-table-column prop="pointFile" label="点位库" width="140">
                <template slot-scope="scope">
                  <el-tooltip placement="top" effect="dark">
                    <div slot="content" v-for="item in (scope.row.pointFile.split(','))">{{ item }}</div>
                    <ul  class="name-wrapper" style="color:#1989fa;cursor: pointer;
                    white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"
                         @click="enterPoint(scope.row)">
                      <li v-for="item in (scope.row.pointFile.split(','))" style="text-align: left">{{ item }}</li>
                    </ul>
                  </el-tooltip>

                </template>
              </el-table-column>