解析<em></em>标签高亮显示

DevEco Studio 版本：DevEco Studio NEXT Developer Preview2
HarmonyOS API 版本：4.1.0(11)

解析标签高亮显示

由于跟后端约定，接口中对于返回的字符串中，使用标签的内容需要使用主题色高亮显示。比如 <em>权力</em>的<em>游戏</em> 第<em>七</em>季。

注意：当前版本不支持标签嵌套。

具体代码如下：

Text() {
    buildHighLightSpan(item.title)
}
.fontSize(17)
.fontColor('#FF222222')
.fontWeight(600)
.textOverflow({
    overflow: TextOverflow.Ellipsis
})
.width('100%')


/**
 * 解析 <em> </em>标签高亮显示
 *
 * 注意：不支持嵌套
 *
 * @param highLightTitle 带标签的文本
 */
@Builder
function buildHighLightSpan(highLightTitle: string | undefined) {
  if (highLightTitle == null || highLightTitle.indexOf('<em>') == -1 || highLightTitle.indexOf('</em>') == -1) {
    Span(highLightTitle?.replace('<em>', '').replace('</em>', '')).fontColor('#FF222222')
  } else {
    ForEach(highLightTitle.split('</em>'), (attr: string) => {
      ForEach(attr.split('<em>'), (item: string, index: number) => {
        if (item != null || item != '') {
          if (index == 0) {
            Span(item).fontColor('#FF222222');
          } else {
            Span(item).fontColor('#FF00A3FF');
          }
        }
      });
    })
  }
}