微信小程序如何实现 点击查看全部

功能需求，文字只显示两行半，超出部分隐藏，并在文字末尾追加 查看全部 的标签，点击查看全部，则显示全部文字
排除方案：排除 根据文字长度做计算的方案，因为文本可能会有换行符，无法单纯根据字符串的长度做计算

用伪类覆盖一半

.box {
  position: relative;
  line-height: 1.4em;
  /* 几倍高度显示几行 */
  height: 4.2em;
  overflow: hidden;
}
.box::after {
  content: "...";
  position: absolute;
  width: 50vw;
  bottom: 0;
  right: 0;
  background: #fff;
}

看看这个https://www.uviewui.com/components/readMore.html

利用css的属性呢，我原来只做过超出显示省略号，没有在后面加过那个‘查看全部’

    overflow:hidden;/*超出隐藏*/
    text-overflow:ellipsis;/*文本溢出时显示省略标记*/
    display:-webkit-box;/*设置弹性盒模型*/
    -webkit-line-clamp:3;/*文本占的行数,如果要设置2行加...则设置为2*/
    -webkit-box-orient:vertical;/*子代元素垂直显示*/

css 显示两行 样式可以实现 。点击全部 就 移除 样式 或者类名 。