HarmonyOS List上展示html字符串

class ArrayList { 
  text: string 
  color: ResourceStr 
  public clickEvent: () => void = () => { 
  } 
 
  constructor(text: string, color: ResourceStr) { 
    this.text = text 
    this.color = color 
  } 
  public onClick(event: () => void): ArrayList { 
    this.clickEvent = event 
    return this 
  } 
} 
@Entry 
@Component 
struct Index { 
  controller: RichEditorController = new RichEditorController(); 
  options: RichEditorOptions = { controller: this.controller }; 
  @State arrayList: Array<ArrayList> = [ 
    new ArrayList(",", "#16abf0").onClick(() => { 
      console.log("") 
    }), 
    new ArrayList("test", "#16abf0").onClick(() => { 
      console.log("test") 
    }), 
    new ArrayList("demo示例", "#ffc6131f").onClick(() => { 
      console.log("demo示例") 
    }), 
    new ArrayList("是否满足", "#16abf0").onClick(() => { 
      console.log("是否满足") 
    }) 
  ] 
  @Builder 
  my_builder(item: string) { 
    Column() { 
      Text(item) 
    } 
  } 
  build() { 
    Column() { 
      List() { 
        ForEach(this.arrayList, (item: ArrayList) => { 
          ListItem() { 
            Column() { 
              RichEditor(this.options) 
                .onReady(() => { 
                  this.controller.addTextSpan(item.text, 
                    { 
                      style: 
                      { 
                        fontColor: item.color, 
                        fontSize: 18, 
                      }, 
                      gesture: { 
                        onClick: () => { 
                          if (item.clickEvent) { 
                            item.clickEvent() 
                          } 
                        } 
                      } 
                    }) 
                }) 
            } 
          } 
        }) 
      } 
    } 
    .width("100%") 
    .height('100%') 
    .backgroundColor($r('sys.color.ohos_id_color_sub_background')) 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.