diff --git a/packages/uni-mp-compiler/__tests__/vHtml.spec.ts b/packages/uni-mp-compiler/__tests__/vHtml.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..781cbdc3230bf58f9b5e728cdafabefb108ebfa2
--- /dev/null
+++ b/packages/uni-mp-compiler/__tests__/vHtml.spec.ts
@@ -0,0 +1,29 @@
+import { assert } from './testUtils'
+
+describe('compiler: transform v-html', () => {
+ test('basic', () => {
+ assert(
+ ``,
+ ``,
+ `(_ctx, _cache) => {
+ return { a: _ctx.html }
+}`
+ )
+ assert(
+ ``,
+ ``,
+ `(_ctx, _cache) => {
+ return {}
+}`
+ )
+ })
+ test('self closing', () => {
+ assert(
+ ``,
+ ``,
+ `(_ctx, _cache) => {
+ return { a: _ctx.html }
+}`
+ )
+ })
+})
diff --git a/packages/uni-mp-compiler/src/compile.ts b/packages/uni-mp-compiler/src/compile.ts
index 171961095c0b59c778cd1b38e0d8673904c596c4..3806b098fdea328a466d07b5d8af80904b90129d 100644
--- a/packages/uni-mp-compiler/src/compile.ts
+++ b/packages/uni-mp-compiler/src/compile.ts
@@ -17,6 +17,7 @@ import { transformComponent } from './transforms/transformComponent'
import { transformSlot } from './transforms/vSlot'
import { transformRoot } from './transforms/transformRoot'
import { transformTag } from './transforms/transformTag'
+import { transformHtml } from './transforms/vHtml'
export type TransformPreset = [
NodeTransform[],
@@ -34,6 +35,7 @@ export function getBaseTransformPreset({
const nodeTransforms = [
transformRoot,
transformTag,
+ transformHtml,
transformIf,
transformFor,
transformSlot,
diff --git a/packages/uni-mp-compiler/src/transforms/vHtml.ts b/packages/uni-mp-compiler/src/transforms/vHtml.ts
new file mode 100644
index 0000000000000000000000000000000000000000..7cc15aee201f126676ea39115471e2c1a153aea8
--- /dev/null
+++ b/packages/uni-mp-compiler/src/transforms/vHtml.ts
@@ -0,0 +1,47 @@
+import {
+ createBindDirectiveNode,
+ isElementNode,
+} from '@dcloudio/uni-cli-shared'
+import {
+ DirectiveNode,
+ ElementNode,
+ ElementTypes,
+ findDir,
+ NodeTypes,
+ PlainElementNode,
+} from '@vue/compiler-core'
+import { NodeTransform } from '../transform'
+
+export const transformHtml: NodeTransform = (node, _) => {
+ if (!isElementNode(node)) {
+ return
+ }
+ const dir = findDir(node, 'html')
+ if (!dir) {
+ return
+ }
+ // remove v-html
+ node.props.splice(node.props.indexOf(dir), 1)
+ if (node.tagType !== ElementTypes.ELEMENT) {
+ return
+ }
+ node.isSelfClosing = false
+ node.children = [createRichText(node, dir)]
+}
+
+function createRichText(
+ node: PlainElementNode,
+ dir: DirectiveNode
+): ElementNode {
+ return {
+ tag: 'rich-text',
+ type: NodeTypes.ELEMENT,
+ tagType: ElementTypes.ELEMENT,
+ props: [createBindDirectiveNode('nodes', dir.exp || '')],
+ isSelfClosing: true,
+ children: [],
+ codegenNode: undefined,
+ ns: node.ns,
+ loc: node.loc,
+ }
+}