iview表格文字超出后使用省略号
yIbanez在前端开发中用常用的框架有:Vue-React-Angular等三大框架
Vue开发中常用的UI逻辑框架是:ElementUI和Iview框架多一些,但是这些框架的大部分css样式,js逻辑部分已经被官方被封装好,直接修改样式很麻烦,最近也遇到了个问题,就是iview的表格中的字符串后面自动产生的多余的三个点怎么去掉的问题?
字符长度超过了默认状态是会自动出现省略号,怎么去掉:
直接上代码吧 ,针对描述这一列,如果字数超出单元格,则显示省略号…
1 {title: '描述', key: 'describe', 2 render:(h, params) => { 3 return h('div', [ 4 h('span', { 5 style: {display: 'inline-block', 6 width: '100%', 7 overflow: 'hidden', 8 textOverflow: 'ellipsis', 9 whiteSpace: 'nowrap'}, 10 domProps: {title: params.row.describe}, 11 on:{click:(e) => { e.stopPropagation();}} 12 }, params.row.describe) 13 ]); 14 } },
把overflow:hidden去掉或者改成none就可以