内容过长会影响样式的省略弹窗显示
2017-12-15 本文已影响13人
Lia代码猪崽
不规则的表格
只显示一部分
点击查看详情显示弹窗
如果内容过长呢?
<div class="specialText">
{{item.name}}:
<!--如果内容长度大于15,后面的就省略,只显示前16个-->
<span v-if="item.content.length > 15" style="color: #0E0E0E;line-height: 17px;">
{{item.content.substring(0, 15)+"... "}}<el-button type="text" @click="openDetail(item.content, item.name)">查看详情</el-button>
</span>
<span v-else style="color: #0E0E0E;line-height: 17px;">{{item.content}};</span>
</div>
// 查看这条内容的详情
openDetail(content, title) {
this.$alert(content, title, {
confirmButtonText: '确定',
});
},
结果为:
只显示一部分
点击查看详情显示弹窗