vue.js如何限制显示数据的范围。

Question

从后端拿回的数据，想直接显示在浏览器里。写了个div。但每回返回的数据会很多，经常在宽度上超出边界，很难看。怎么设置能让数据只显示在设定的框内。前端代码：<div class="show-data">      {{searchRst}}                </div>CSS：.show-data{  background-color: #d7d8dd;  color: #000000;  width: 900px;  height: 800px;  font-weight: 900;  margin-bottom: 80px;  margin-top: 10px;}不知道各位有木有好办法。

Answer 1

不全都显示的话截取一部分？

Answer 2

1、js截断，多余的省略号。这种方式兼容性好
2、CSS3的text-overflow: ellipsis;

Answer 3

看你什么需求，就是简单的隐藏的话，overflow：hidden
强制1行显示
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
强制2行显示
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
以此类推。。。。。