关于小程序的字体面板折叠的方法

做的时候也是无限踩坑,最终还是做出来了,代码如下

wxml代码

{{motto}}
{{isF ? ‘<更多>’ : ‘收起’}}
在这里插入图片描述

`wxss代码

/*文本描述 /
.bix_box{
display: flex;
justify-content: space-between;
position: relative;
/
height: 300rpx; /
width: 100%;
}
.conts {
text-indent: 8%;
font-size: 20rpx;
/
line-height: 50rpx; /
/
background-color: grey; */
/*关键属性(必须有的) */
display: -webkit-box;
}

.hide {
/*规定子元素的排列方向 */
-webkit-box-orient: vertical;
/*限制文本显示的行数 */
-webkit-line-clamp: 2;
/*实现多余的文字隐藏并用省略号来代表被隐藏的文字 */
overflow: hidden;
text-overflow: ellipsis;
}
.xianshi{
color: #0084ff;
font-size: 20rpx;
position: absolute;
bottom: 2rpx;
right: 5rpx;
}``

wxjs代码

data: {
currentTab:0,
motto: ‘这是字’,
isF: true
},
aa: function () {
this.setData({
isF: !this.data.isF
})
},

你可能感兴趣的:(字体面板折叠)