fix(ssr): fix class/style rendering + ssrRenderComponent export name

This commit is contained in:
Evan You 2020-02-14 20:48:06 -05:00
parent 66b5f0b480
commit 688ad92391
3 changed files with 11 additions and 7 deletions

View File

@ -77,7 +77,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div id="foo" :class="bar"></div>`) getCompiledString(`<div id="foo" :class="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div id=\\"foo\\"\${_ssrRenderClass(_ctx.bar)}></div>\`"` `"\`<div id=\\"foo\\" class=\\"\${_ssrRenderClass(_ctx.bar)}\\"></div>\`"`
) )
}) })
@ -85,7 +85,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div class="foo" :class="bar"></div>`) getCompiledString(`<div class="foo" :class="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}></div>\`"` `"\`<div class=\\"\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}\\"></div>\`"`
) )
}) })
@ -93,7 +93,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div id="foo" :style="bar"></div>`) getCompiledString(`<div id="foo" :style="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div id=\\"foo\\"\${_ssrRenderStyle(_ctx.bar)}></div>\`"` `"\`<div id=\\"foo\\" style=\\"\${_ssrRenderStyle(_ctx.bar)}\\"></div>\`"`
) )
}) })
@ -101,7 +101,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div style="color:red;" :style="bar"></div>`) getCompiledString(`<div style="color:red;" :style="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}></div>\`"` `"\`<div style=\\"\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}\\"></div>\`"`
) )
}) })

View File

@ -176,10 +176,12 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
// static key attr // static key attr
if (attrName === 'class') { if (attrName === 'class') {
openTag.push( openTag.push(
` class="`,
(dynamicClassBinding = createCallExpression( (dynamicClassBinding = createCallExpression(
context.helper(SSR_RENDER_CLASS), context.helper(SSR_RENDER_CLASS),
[value] [value]
)) )),
`"`
) )
} else if (attrName === 'style') { } else if (attrName === 'style') {
if (dynamicStyleBinding) { if (dynamicStyleBinding) {
@ -187,10 +189,12 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
mergeCall(dynamicStyleBinding, value) mergeCall(dynamicStyleBinding, value)
} else { } else {
openTag.push( openTag.push(
` style="`,
(dynamicStyleBinding = createCallExpression( (dynamicStyleBinding = createCallExpression(
context.helper(SSR_RENDER_STYLE), context.helper(SSR_RENDER_STYLE),
[value] [value]
)) )),
`"`
) )
} }
} else { } else {

View File

@ -2,7 +2,7 @@
export { renderToString } from './renderToString' export { renderToString } from './renderToString'
// internal runtime helpers // internal runtime helpers
export { renderComponent } from './renderToString' export { renderComponent as ssrRenderComponent } from './renderToString'
export { ssrRenderSlot } from './helpers/ssrRenderSlot' export { ssrRenderSlot } from './helpers/ssrRenderSlot'
export { export {
ssrRenderClass, ssrRenderClass,