vue+elementUI當渲染文本超出一定字數時顯示省略號

 

 

如圖,當渲染的文字超出30字后顯示省略號

1.設置過濾器

filters: {
ellipsis(value) {
if (!value) return "";
if (value.length > 30) {
return value.slice(0, 30) + "...";
}
return value;
}
},

2.使用過濾器

<el-table-column label="題干" width="600">
<template slot-scope="scope">
<span>{{scope.row.content | ellipsis}}</span>
</template>
</el-table-column>

3.ok了