600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > 微信小程序 - 实现文本展开与收起功能组件(初始时隐藏文字内容 当点击查看更多时

微信小程序 - 实现文本展开与收起功能组件(初始时隐藏文字内容 当点击查看更多时

时间:2020-01-06 14:56:29

相关推荐

微信小程序 - 实现文本展开与收起功能组件(初始时隐藏文字内容 当点击查看更多时

前言

当展示一大段文本内容时,通常会采用 “查看更多 / 展开” 方式,当用户点击时展开全部内容,再次点击收起内容。网上的教程大部分又乱且功能有 BUG,本文提供代码干净整洁且注释详细的功能强壮示例。

本文实现了根据文字内容,判断是否隐藏折叠,当文字少时不显示 “展开按钮” ,反之显示,

支持自定义多少行才隐藏,支持将 “展开/折叠” 按钮的位置随意摆放,随便 DIY 一切样式。

如下图所示,以组件形式完成,利于您后期无限复用,只需要传入内容即可自动完成:

仅提供核心功能,无乱七八糟的样式,兼容完美,让您方便移植该功能

组件源码

推荐使用平台一键复制功能,避免漏选。

在项目components文件夹下新建collapse组件,复制以下代码:

微信小程序 - 实现文本展开与收起功能组件(初始时隐藏文字内容 当点击查看更多时展开)点击隐藏和点击显示 / 折叠与展开 / 大段文本内容过多 实现折叠与展开效果 超详细代码注释文章教程源码插件

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。