diff --git a/packages/compiler-ssr/__tests__/ssrElement.spec.ts b/packages/compiler-ssr/__tests__/ssrElement.spec.ts index 8f0e28f4e14..4056b4c3c71 100644 --- a/packages/compiler-ssr/__tests__/ssrElement.spec.ts +++ b/packages/compiler-ssr/__tests__/ssrElement.spec.ts @@ -25,7 +25,7 @@ describe('ssr: element', () => { test('v-html', () => { expect(getCompiledString(`
`)).toMatchInlineSnapshot(` "\`
\${ - _ctx.foo + (_ctx.foo) ?? '' }
\`" `) }) diff --git a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts index 050528f5870..7175b797d48 100644 --- a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts +++ b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts @@ -22,6 +22,7 @@ import { createAssignmentExpression, createCallExpression, createCompilerError, + createCompoundExpression, createConditionalExpression, createInterpolation, createSequenceExpression, @@ -188,7 +189,10 @@ export const ssrTransformElement: NodeTransform = (node, context) => { // special cases with children override if (prop.type === NodeTypes.DIRECTIVE) { if (prop.name === 'html' && prop.exp) { - rawChildrenMap.set(node, prop.exp) + rawChildrenMap.set( + node, + createCompoundExpression([`(`, prop.exp, `) ?? ''`]), + ) } else if (prop.name === 'text' && prop.exp) { node.children = [createInterpolation(prop.exp, prop.loc)] } else if (prop.name === 'slot') {