HarmonyOS 鸿蒙Next 搜索关键字匹配变化红换行了如何解决

参考：

export enum SpanType {
  normal,
  hyperlink,
}
export class CustomSpan {
  public content: string | Resource
  public type: SpanType
  public event: () => void
  constructor(content: string | Resource, type: SpanType = SpanType.normal, event: () => void = () => {
  }) {
    this.content = content
    this.type = type
    this.event = event
  }
  normal(): CustomSpan {
    this.type = SpanType.normal
    return this
  }
  hyperlink(event: () => void): CustomSpan {
    this.type = SpanType.hyperlink
    this.event = event
    return this
  }
}
export class CustomText {
  public static readonly PLACEHOLDER = new RegExp('(%[1-9]{1}[0-9]{0,}\\$s)')
  public spans: Array<CustomSpan>
  constructor(spans: Array<CustomSpan> = []) {
    this.spans = spans
  }
  append(span: CustomSpan): CustomText {
    this.spans.push(span)
    return this
  }
  appendNormal(text: string | Resource): CustomText {
    this.append(new CustomSpan(text).normal())
    return this
  }
  appendHyperlink(text: string | Resource, onClick: () => void): CustomText {
    this.append(new CustomSpan(text).hyperlink(onClick))
    return this
  }
  format(format: string | Resource, args: Array<CustomSpan> = []): CustomText {
    if (!format || !args || args?.length === 0) {
      this.appendNormal(format)
      return this
    }
    if (typeof format === 'string') {
      if (format.length !== 0) {
        this.resolve(format, args)
      }
    } else {
      try {
        let value: string = getContext(this).resourceManager.getStringSync(format)
        if (value && value.length !== 0) {
          this.resolve(value, args)
        }
      } catch (e) {
        console.warn(`CustomText getStringSync: ${JSON.stringify(format)} exception: ${e}`);
      }
    }
    return this
  }
  private resolve(format: string, args: Array<CustomSpan>): CustomText {
    let length: number = args.length
    format.split(CustomText.PLACEHOLDER).forEach((value: string, index: number) => {
      if (!value.match(CustomText.PLACEHOLDER)) {
        this.appendNormal(value)
        return
      }
      let argIndex: number = Number(value.replace('%', '').replace('$s', '')) - 1
      if (argIndex >= length) {
        return
      }
      let span: CustomSpan = args[argIndex++]
      if (span.type === SpanType.normal) {
        this.appendNormal(span.content)
      } else if (span.type === SpanType.hyperlink) {
        this.appendHyperlink(span.content, span.event)
      }
    })
    return this
  }
}
class DeclareDemo {
  format: string | Resource = ''
  args: CustomSpan[] = []
}
@Entry
@Component
struct TextDemoPage {
  urlRegex = /测试一下/g;
  @State declare: DeclareDemo = {
    format: '',
    args: []
  }
  @State textDeclare: Array<CustomText> = []
  aboutToAppear(): void {
    let text: string = '这是一个示例文本测试一下。哈哈哈哈哈哈哈测试一下 哈哈哈哈哈测试一下 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈测试一下哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈 哈哈哈哈哈再测试一下'
    let urls = text.match(this.urlRegex)
    let newText: string = text
    if(urls) {
      let args: CustomSpan[] = []
      urls.forEach((url, idx) => {
        newText = newText.replace(url, `%${idx+1}$s`)
        args.push(new CustomSpan(url).hyperlink(() => {
          console.log('111111111111---url: ', url)
        }),)
      });
      this.declare = {
        format: newText,
        args: args
      }
      this.textDeclare = [new CustomText().format(this.declare.format, this.declare.args)]
      console.log('111 -this.textDeclare: ', JSON.stringify(this.textDeclare))
    }
  }
  build() {
    Row() {
      Column() {
        ForEach(this.textDeclare, (declare: CustomText, index) => {
          Text() {
            ForEach(declare.spans, (span: CustomSpan) => {
              if (span.type == SpanType.normal) {
                Span(span.content)
                  .fontSize(14)
                  .fontColor('#191919')
              } else if (span.type == SpanType.hyperlink) {
                Span(span.content)
                  .fontSize(14)
                  .fontColor(Color.Red)
                  .decoration({type: TextDecorationType.None, color: '#007dff'})
                  .onClick(() => {
                    if (span.event) {
                      span.event()
                    }
                  })
              }
            })
          }
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}