iview中使用table组件时单元格数据溢出省略号及tooltip
目标:
代码:js部分
{ key: 'discDetail', title: '个人介绍', render:(h,params)=>{ return h('div', [ h('Tooltip', { props: { placement: 'top', transfer: true }, style:{ display: 'inline-block', width: '100%', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', borderColor:"1px", borderWidth:'red' } }, [params.row.discDetail, h('span', { slot: 'content', style: { whiteSpace: 'normal', } }, params.row.discDetail) ]) ]) } }, css部分: /deep/ .ivu-tooltip-rel{ display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 分析:在尝试单元格内容溢出样式时无论如何尝试都难以将样式填充进入,尝试重定义样式成功
特此记录