工作-iview的Tooltip+render函数

背景

最近需要实现一个列表中一项展示部分文案，鼠标移动到该文案上，在左边悬浮提示框。
比如iview组件内这种效果：

因为使用的是render来进行渲染列表的，所以就需要在render中渲染Tooltip。

代码如下：

<Table 
    :columns="cluesTitle" 
    :data="cluesList"
></Table>

cluesTitle：[
{
   title: "内容",
   key: "content",
   align: "center",
   ellipsis: true,
   width: 150,
   render: (h, params) => {
       let texts = params.row.content ? params.row.content : '-';
       return h('div', [h('Tooltip', {
           props:{
            placement: 'left'
        }
    },
    [
            texts,
            h('span', {
                slot: 'content',             //slot属性
                style: {
                    whiteSpace: 'nowrap',
                    wordBreak: 'break-all'
                }
            }, params.row.content || '-')
        ]
    )])
}
},
]