x-html-u HTML安全渲染
安全渲染 HTML。丢弃 script / iframe 等危险标签,支持标题、列表、表格、链接、图片,段落可系统选区复制。
兼容性
| Harmony | IOS | Android | WEB | 小程序 |
|---|---|---|---|---|
| 支持 | 支持 | 支持 | 支持 | 支持 |
调用
vue
<x-html-u
ref="htmlRef"
:html="htmlContent"
:dark="false"
:font-size="17"
@linkclick="onLinkClick"
@imageclick="onImageClick"
@rendered="onRendered"
></x-html-u>只解析不渲染:
ts
import { xHtmlParse } from "@/uni_modules/x-html-u"
xHtmlParse(html, {
success: (res) => {
console.log(res.plainText, res.ir)
}
})参数
| 字段 | 说明 | 默认 |
|---|---|---|
| html | HTML 内容 | "" |
| dark | 深色 | false |
| fontSize | 基础字号 px | 15 |
| lineHeight | 行高倍数 | 1.4 |
事件
| 名称 | 参数 | 说明 |
|---|---|---|
| sizechange | { width, height } | 内容尺寸变化 |
| linkclick | { href, text, title } | 点击链接 |
| imageclick | { src, alt, title } | 点击图片 |
| rendered | { blockCount, parseMs, droppedNodeCount, droppedAttributeCount } | 渲染完成 |
| error | { errSubject, errCode, errMsg } | 解析或渲染失败 |
方法
| 名称 | 需要 | 说明 |
|---|---|---|
| setContent | html: string | 全量更新 HTML |
| getContent | 无 | 返回当前原始 HTML |
| getPlainText | 无 | 返回解析后的纯文本 |
| getIR | 无 | 返回渲染中间层 JSON |
| xHtmlParse | html,可选 success / fail / complete | 只解析不渲染,独立函数 |
版本
版权归https://xui.tmui.design你不得修改及二次开发,仅供TMUI4会员商用使用。不得转给非VIP会员使用,一经查实数倍赔偿,并追究法律责任。
