输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
文档管理中心

HarmonyOS 5.0.1(13)

输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
API参考
高级筛选
Created with Pixso.
元服务API集不筛选
您当前浏览的HarmonyOS 5.0.1(API 13)文档归档不再维护，推荐您使用最新版本。详细请参考文档维护策略变更。
API参考应用框架ArkUI（方舟UI框架）JS组件兼容JS的类Web开发范式（ArkUI.Full）基础组件richtext

richtext

更新时间: 2025-03-14 09:23
本文导读
展开章节
说明

  • 该组件从API version 6开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。

  • 富文本内容需要写在元素标签内。

富文本组件，用于展示富文本信息。

权限列表

无

属性

仅支持通用属性中的id、style和class属性。

样式

仅支持通用样式中的display和visibility样式。

事件

除支持通用事件外，还支持如下事件：

展开
名称 参数 描述
start - 开始加载时触发。
complete - 加载完成时触发。
说明

  • 不支持focus、blur、key事件。

  • 不支持无障碍事件。

  • 包含richtext的页面返回时richtext显示区域不会跟随页面的转场动效。

  • richtext内容不建议超过一个屏幕高度，超出部分不会显示。

  • 不支持设置宽度，默认撑开全屏。

方法

不支持。

示例

收起
自动换行
深色代码主题
复制
  1. <!-- xxx.hml -->
  2. <div style="flex-direction: column;width: 100%;">
  3.   <richtext @start="onLoadStart" @complete="onLoadEnd">{{content}}</richtext>
  4. </div>
收起
自动换行
深色代码主题
复制
  1. // xxx.js
  2. export default {
  3.   data: {
  4.     content: `
  5.     <div class="flex-direction: column; background-color: #ffffff; padding: 30px; margin-bottom: 30px;"  style="background-color: #FFFFFF">
  6.       <style>h1{color: yellow;}</style>
  7.       <p class="item-title">h1</p>
  8.       <h1>文本测试(h1测试)</h1>
  9.       <p class="item-title">h2</p>
  10.       <h2>文本测试(h2测试)</h2>
  11.     </div>
  12.     `,
  13.   },
  14.   onLoadStart() {
  15.     console.error("start load rich text:" + JSON.stringify())
  16.   },
  17.   onLoadEnd() {
  18.     console.error("end load rich text:" + JSON.stringify())
  19.   }
  20. }
rating
search
简体中文
华为开发者联盟 版权所有 ©2026
问题反馈
使用条款
华为开发者联盟用户协议
关于华为开发者联盟与隐私的声明
Cookies
开源软件声明
在 API参考 中进行搜索
请输入您想要搜索的关键词