.box{
width:100rpx
height:30rpx//高度不能乱写,你要自己去看你的两行文字占多少高度
font-size:15rpx
overflow:hidden//一定要写
text-overflow: ellipsis//超出省略号
display:-webkit-box//一定要写
-webkit-line-clamp: 2//控制行数
-webkit-box-orient: vertical//一定要写
}
需求:为了引导用户去支付我们的产品,新增需求:1、文本多于一行的时候,只显示一行。2、文本等于1行的时候,全部隐藏显示阴影。实现思路:1、css里设置view的line-height,我这里设置了25px。
2、然后动态算出这个view在填充完数据后的高度,我这里填充完数据是200px。3、所以行数=view的高度/line-height,也就是200px/25px = 8行。
注意:这里的view一定要是填充完数据后的高度,也就是this.setData后的高度。
顺便提下,我这里给文字设置阴影的方法是:
想实现小程序中组件text最多显示两行内容,如果超出就省略号,搞了半天都没师兄,百度出来的全都不对,这可和微信开发者工具的版本有关系.因为我发现好多效果和例子实现出来的完全不一样,mmp!
white-space: nowrap 网上很多博客都有whiteice-space,我设置了就不行,删除了就对了
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)