提交 23666102 编写于 作者: Q qiang

fix: 支持作用域插槽当作普通插槽使用(微信小程序、QQ小程序) question/98634

上级 bcecd71b
...@@ -32,11 +32,21 @@ module.exports = { ...@@ -32,11 +32,21 @@ module.exports = {
state.componentGenerics[componentName] = true state.componentGenerics[componentName] = true
return { // 返回多个节点,支持作用域插槽当作普通插槽使用
type: componentName, return [
attr: props || {}, {
children: [] type: 'slot',
} attr: {
name: slotName
},
children: []
},
{
type: componentName,
attr: props || {},
children: []
}
]
}, },
resolveScopedSlots (slotName, { resolveScopedSlots (slotName, {
genCode, genCode,
......
...@@ -72,16 +72,23 @@ describe('mp:compiler-mp-weixin', () => { ...@@ -72,16 +72,23 @@ describe('mp:compiler-mp-weixin', () => {
}) })
it('generate scoped slot', () => { it('generate scoped slot', () => {
assertCodegen(
'<slot v-bind:user="user"></slot>',
'<slot></slot><scoped-slots-default user="{{user}}" bind:__l="__l"></scoped-slots-default>',
function (res) {
expect(res.componentGenerics['scoped-slots-default']).toBe(true)
}
)
assertCodegen( // TODO vue-id assertCodegen( // TODO vue-id
'<span><slot v-bind:user="user">{{ user.lastName }}</slot></span>', '<span><slot v-bind:user="user">{{ user.lastName }}</slot></span>',
'<label class="_span"><block wx:if="{{$slots.default}}"><scoped-slots-default user="{{user}}" bind:__l="__l"></scoped-slots-default></block><block wx:else>{{user.lastName}}</block></label>', '<label class="_span"><block wx:if="{{$slots.default}}"><slot></slot><scoped-slots-default user="{{user}}" bind:__l="__l"></scoped-slots-default></block><block wx:else>{{user.lastName}}</block></label>',
function (res) { function (res) {
expect(res.componentGenerics['scoped-slots-default']).toBe(true) expect(res.componentGenerics['scoped-slots-default']).toBe(true)
} }
) )
assertCodegen( assertCodegen(
'<span><slot name="header" v-bind:user="user">{{ user.lastName }}</slot></span>', '<span><slot name="header" v-bind:user="user">{{ user.lastName }}</slot></span>',
'<label class="_span"><block wx:if="{{$slots.header}}"><scoped-slots-header user="{{user}}" bind:__l="__l"></scoped-slots-header></block><block wx:else>{{user.lastName}}</block></label>', '<label class="_span"><block wx:if="{{$slots.header}}"><slot name="header"></slot><scoped-slots-header user="{{user}}" bind:__l="__l"></scoped-slots-header></block><block wx:else>{{user.lastName}}</block></label>',
function (res) { function (res) {
expect(res.componentGenerics['scoped-slots-header']).toBe(true) expect(res.componentGenerics['scoped-slots-header']).toBe(true)
} }
...@@ -113,4 +120,4 @@ describe('mp:compiler-mp-weixin', () => { ...@@ -113,4 +120,4 @@ describe('mp:compiler-mp-weixin', () => {
'<view><slot-comp generic:scoped-slots-test="test-slot-comp-test" vue-id="551070e6-1" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test1" vue-id="551070e6-2" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test2" vue-id="551070e6-3" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test3" vue-id="551070e6-4" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp></view>' '<view><slot-comp generic:scoped-slots-test="test-slot-comp-test" vue-id="551070e6-1" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test1" vue-id="551070e6-2" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test2" vue-id="551070e6-3" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp><slot-comp generic:scoped-slots-test="test-slot-comp-test3" vue-id="551070e6-4" bind:__l="__l" vue-slots="{{[\'test\']}}"></slot-comp></view>'
) )
}) })
}) })
...@@ -172,6 +172,8 @@ describe('mp:compiler', () => { ...@@ -172,6 +172,8 @@ describe('mp:compiler', () => {
it('generate single slot', () => { it('generate single slot', () => {
assertCodegen('<view><slot></slot></view>', '<view><slot></slot></view>') assertCodegen('<view><slot></slot></view>', '<view><slot></slot></view>')
assertCodegen('<view><slot>default</slot></view>', '<view><block wx:if="{{$slots.default}}"><slot></slot></block><block wx:else>default</block></view>')
assertCodegen('<view><slot>{{hello}}</slot></view>', '<view><block wx:if="{{$slots.default}}"><slot></slot></block><block wx:else>{{hello}}</block></view>')
assertCodegen('<view><slot name="default"></slot></view>', '<view><slot></slot></view>') assertCodegen('<view><slot name="default"></slot></view>', '<view><slot></slot></view>')
}) })
......
...@@ -164,7 +164,7 @@ function traverseCreateElement (callExprNode, state) { ...@@ -164,7 +164,7 @@ function traverseCreateElement (callExprNode, state) {
node.children = node.children.concat(normalizeChildren(traverseExpr(childNodes, state))) node.children = node.children.concat(normalizeChildren(traverseExpr(childNodes, state)))
} else { } else {
node.children = normalizeChildren(traverseExpr(childNodes, state)) node.children = normalizeChildren(traverseExpr(childNodes, state))
} }
} }
return node return node
} }
...@@ -264,7 +264,7 @@ function genSlotNode (slotName, slotNode, fallbackNodes, state) { ...@@ -264,7 +264,7 @@ function genSlotNode (slotName, slotNode, fallbackNodes, state) {
attr: { attr: {
[prefix + 'if']: '{{$slots.' + slotName + '}}' [prefix + 'if']: '{{$slots.' + slotName + '}}'
}, },
children: [slotNode] children: [].concat(slotNode)
}, { }, {
type: 'block', type: 'block',
attr: { attr: {
...@@ -461,4 +461,4 @@ function traverseCreateTextVNode (callExprNode, state) { ...@@ -461,4 +461,4 @@ function traverseCreateTextVNode (callExprNode, state) {
function traverseCreateEmptyVNode (callExprNode, state) { function traverseCreateEmptyVNode (callExprNode, state) {
return '' return ''
} }
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册