fix(slots): compiled slot fallback should be functions (#1030)

This avoids it being collected as dynamic children when it's not used.

fix #1021
This commit is contained in:
underfin 2020-04-23 04:52:41 +08:00 committed by GitHub
parent ff4d1fcd81
commit 2b19965bcf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 46 additions and 29 deletions

View File

@ -216,12 +216,16 @@ describe('compiler: transform <slot> outlets', () => {
`$slots`,
`"default"`,
`{}`,
[
{
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: [],
returns: [
{
type: NodeTypes.ELEMENT,
tag: `div`
}
]
}
]
})
})
@ -235,12 +239,16 @@ describe('compiler: transform <slot> outlets', () => {
`$slots`,
`"foo"`,
`{}`,
[
{
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: [],
returns: [
{
type: NodeTypes.ELEMENT,
tag: `div`
}
]
}
]
})
})
@ -268,12 +276,16 @@ describe('compiler: transform <slot> outlets', () => {
}
]
},
[
{
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: [],
returns: [
{
type: NodeTypes.ELEMENT,
tag: `div`
}
]
}
]
})
})
@ -301,12 +313,16 @@ describe('compiler: transform <slot> outlets', () => {
}
]
},
[
{
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: [],
returns: [
{
type: NodeTypes.ELEMENT,
tag: `div`
}
]
}
]
})
})

View File

@ -4,7 +4,8 @@ import {
CallExpression,
createCallExpression,
ExpressionNode,
SlotOutletNode
SlotOutletNode,
createFunctionExpression
} from '../ast'
import { isSlotOutlet, findProp } from '../utils'
import { buildProps, PropsExpression } from './transformElement'
@ -29,7 +30,7 @@ export const transformSlotOutlet: NodeTransform = (node, context) => {
if (!slotProps) {
slotArgs.push(`{}`)
}
slotArgs.push(children)
slotArgs.push(createFunctionExpression([], children, false, false, loc))
}
node.codegenNode = createCallExpression(

View File

@ -15,8 +15,8 @@ export function renderSlot(
name: string,
props: Data = {},
// this is not a user-facing function, so the fallback is always generated by
// the compiler and guaranteed to be an array
fallback?: VNodeArrayChildren
// the compiler and guaranteed to be a function returning an array
fallback?: () => VNodeArrayChildren
): VNode {
let slot = slots[name]
@ -34,7 +34,7 @@ export function renderSlot(
createBlock(
Fragment,
{ key: props.key },
slot ? slot(props) : fallback || [],
slot ? slot(props) : fallback ? fallback() : [],
slots._ ? PatchFlags.STABLE_FRAGMENT : PatchFlags.BAIL
)
)