多行文本超出显示查看更多和收起

<view class="moreText" v-if="item.seeMore" @tap="toggleHandler(index)">查看更多</view>
<view class="moreText" v-if="!item.seeMore && item.auto" @tap="toggleContent(index)">收起</view>

export default {
data() {
return {
trendsList:[
{
auto: false,
seeMore: false,
text: ‘好产品超高品质，刚需免费，超级满意，夫人特批酒，夫君放心喝，纯粮酒不上头‘,
},
]
}
},
onReady() {
const query = uni.createSelectorQuery().in(this);
query.selectAll(‘.publishText‘).boundingClientRect(data => {
console.log(data)
// console.log("得到布局位置信息" + JSON.stringify(data));
// console.log("节点离页面顶部的距离为" + data.top);
}).exec(res=> {
console.log(res)
let lineHeight = 17 //固定高度值 单位：PX
for(let i=0; i<res[0].length; i++) {
console.log(res[0][i].height)
console.log(lineHeight)
if((res[0][i].height / lineHeight) >= 3) {
this.trendsList[i].auto = true
this.trendsList[i].seeMore = true
console.log(1111)
}
}
console.log(this.trendsList)
});
},
methods: {
//查看更多
toggleHandler(index) {
this.trendsList[index].auto = true;
this.trendsList[index].seeMore = false
},
//收起
toggleContent(index) {
this.trendsList[index].auto = true;
this.trendsList[index].seeMore = true
}
}
}

多行文本超出显示查看更多和收起

原文：https://www.cnblogs.com/daihongcheng/p/14844652.html