HarmonyOS鸿蒙Next中Text.maxLines(2) .textOverflow({ overflow: TextOverflow.Ellipsis })的使用

可以参考这个展开收起的demo，使用文本计算去实现，可以自行更改实现你要的效果，参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-measure-V5#measuretextmeasuretext

import inspector from '@ohos.arkui.inspector';
import componentUtils from '@ohos.arkui.componentUtils';
import measure from '@ohos.measure'

@Entry
@Component
export struct TextButton {
  @State content: string = '#限定的校服,2222222222222222222222222222222222222223333'
  private measureText = this.content;
  @State maxLines: number = Infinity
  @State isCollapse: boolean = true; // true收起 false展开
  @State collapseTxt: string = '…[展开]';
  private subTxt: string = '';
  @State flag: boolean = false; // 是否需要展开收起

  build() {
    Row() {
      Column() {
        Text() {
          if(this.flag){
            Span(this.collapseTxt)
              .onClick((){
                if(this.isCollapse){
                  this.maxLines = Infinity;
                  this.content = this.measureText;
                  this.isCollapse = false;
                  this.collapseTxt = '[收起]';
                } else {
                  this.isCollapse = true;
                  this.collapseTxt = '…[展开]';
                  this.content = this.subTxt;
                }
              })
          }
        }
        .textOverflow({ overflow: TextOverflow.Ellipsis })
        .maxLines(this.maxLines)
        .fontSize(24)
        .width(300)
        .backgroundColor(Color.White)
        .key('txt_info')
      }
      .width('100%')
    }
    .height('100%')
  }
  listener:inspector.ComponentObserver = inspector.createComponentObserver('txt_info')

  aboutToAppear() {
    let onLayoutComplete:()=>void=():void=>{
      if(this.isCollapse){
        this.getComponentRect('txt_info');
      }
    }
    let onDrawComplete:()=>void=():void=>{
      if(this.isCollapse) {
        this.subTxt = this.content;
      }
    }
    let FuncLayout = onLayoutComplete
    let FuncDraw = onDrawComplete
    this.listener.on('layout', FuncLayout)
    this.listener.on('draw', FuncDraw)
  }
  private getComponentRect(key:string) {
    let modePosition = componentUtils.getRectangleById(key);
    let localOffsetHeight = modePosition.size.height;
    const textSize : SizeOptions = measure.measureTextSize({ textContent: this.content, fontSize: 24, constraintWidth: 300 })
    const textSize2 : SizeOptions = measure.measureTextSize({ textContent: this.content, fontSize: 24, maxLines: 3, constraintWidth: 300 })
    if((textSize.height || 0) > (textSize2.height || 0)) this.flag = true;
    console.info(`localOffsetHeight ${localOffsetHeight} textSize${textSize.height} textSize2 ${textSize2.height}`)
    if(localOffsetHeight > (textSize2.height || 300)){
      this.content = this.content.substring(0, this.content.length - 2);
      this.isCollapse = true;
    }
  }
}