Commit5a9da95

committed

fix(slots): properly handle nested named slot passing

1 parent4fe1a95 commit5a9da95Copy full SHA for 5a9da95

File tree

+53

-8

lines changed

+53

-8

lines changed

Lines changed: 1 addition & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -467,7 +467,7 @@ function processSlot (el) {`
`467`	`467`	`el.slotTarget=slotTarget==='""' ?'"default"' :slotTarget`
`468`	`468`	`// preserve slot as an attribute for native shadow DOM compat`
`469`	`469`	`// only for non-scoped slots.`
`470`		`-if(!el.slotScope){`
	`470`	`+if(el.tag!=='template'&&!el.slotScope){`
`471`	`471`	`addAttr(el,'slot',slotTarget)`
`472`	`472`	`}`
`473`	`473`	`}`

Lines changed: 10 additions & 2 deletions

Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,7 @@ export function renderSlot (`
`12`	`12`	`bindObject: ?Object`
`13`	`13`	`): ?Array<VNode>{`
`14`	`14`	`constscopedSlotFn=this.$scopedSlots[name]`
	`15`	`+letnodes`
`15`	`16`	`if(scopedSlotFn){// scoped slot`
`16`	`17`	`props=props\|\|{}`
`17`	`18`	`if(bindObject){`
`@@ -23,7 +24,7 @@ export function renderSlot (`
`23`	`24`	`}`
`24`	`25`	`props=extend(extend({},bindObject),props)`
`25`	`26`	`}`
`26`		`-returnscopedSlotFn(props)\|\|fallback`
	`27`	`+nodes=scopedSlotFn(props)\|\|fallback`
`27`	`28`	`}else{`
`28`	`29`	`constslotNodes=this.$slots[name]`
`29`	`30`	`// warn duplicate slot usage`
`@@ -37,6 +38,13 @@ export function renderSlot (`
`37`	`38`	`}`
`38`	`39`	`slotNodes._rendered=true`
`39`	`40`	`}`
`40`		`-returnslotNodes\|\|fallback`
	`41`	`+nodes=slotNodes\|\|fallback`
	`42`	`+}`
	`43`	`+`
	`44`	`+consttarget=props&&props.slot`
	`45`	`+if(target){`
	`46`	`+returnthis.$createElement('template',{slot:target},nodes)`
	`47`	`+}else{`
	`48`	`+returnnodes`
`41`	`49`	`}`
`42`	`50`	`}`

Lines changed: 6 additions & 5 deletions

Original file line number	Diff line number	Diff line change
`@@ -11,7 +11,6 @@ export function resolveSlots (`
`11`	`11`	`if(!children){`
`12`	`12`	`returnslots`
`13`	`13`	`}`
`14`		`-constdefaultSlot=[]`
`15`	`14`	`for(leti=0,l=children.length;i<l;i++){`
`16`	`15`	`constchild=children[i]`
`17`	`16`	`constdata=child.data`
`@@ -32,12 +31,14 @@ export function resolveSlots (`
`32`	`31`	`slot.push(child)`
`33`	`32`	`}`
`34`	`33`	`}else{`
`35`		`-defaultSlot.push(child)`
	`34`	`+(slots.default\|\|(slots.default=[])).push(child)`
`36`	`35`	`}`
`37`	`36`	`}`
`38`		`-// ignore whitespace`
`39`		`-if(!defaultSlot.every(isWhitespace)){`
`40`		`-slots.default=defaultSlot`
	`37`	`+// ignore slots that contains only whitespace`
	`38`	`+for(constnameinslots){`
	`39`	`+if(slots[name].every(isWhitespace)){`
	`40`	`+deleteslots[name]`
	`41`	`+}`
`41`	`42`	`}`
`42`	`43`	`returnslots`
`43`	`44`	`}`

Lines changed: 36 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -743,4 +743,40 @@ describe('Component slot', () => {`
`743`	`743`	`}).$mount()`
`744`	`744`	`expect(vm.$el.children[0].getAttribute('slot')).toBe('foo')`
`745`	`745`	`})`
	`746`	`+`
	`747`	`+it('passing a slot down as named slot',()=>{`
	`748`	`+constBar={`
	`749`	+template:`<div class="bar"><slot name="foo"/></div>`
	`750`	`+}`
	`751`	`+`
	`752`	`+constFoo={`
	`753`	`+components:{ Bar},`
	`754`	+template:`<div class="foo"><bar><slot slot="foo"/></bar></div>`
	`755`	`+}`
	`756`	`+`
	`757`	`+constvm=newVue({`
	`758`	`+components:{ Foo},`
	`759`	+template:`<div><foo>hello</foo></div>`
	`760`	`+}).$mount()`
	`761`	`+`
	`762`	`+expect(vm.$el.innerHTML).toBe('<div class="foo"><div class="bar">hello</div></div>')`
	`763`	`+})`
	`764`	`+`
	`765`	`+it('fallback content for named template slot',()=>{`
	`766`	`+constBar={`
	`767`	+template:`<div class="bar"><slot name="foo">fallback</slot></div>`
	`768`	`+}`
	`769`	`+`
	`770`	`+constFoo={`
	`771`	`+components:{ Bar},`
	`772`	+template:`<div class="foo"><bar><template slot="foo"/><slot/></template></bar></div>`
	`773`	`+}`
	`774`	`+`
	`775`	`+constvm=newVue({`
	`776`	`+components:{ Foo},`
	`777`	+template:`<div><foo></foo></div>`
	`778`	`+}).$mount()`
	`779`	`+`
	`780`	`+expect(vm.$el.innerHTML).toBe('<div class="foo"><div class="bar">fallback</div></div>')`
	`781`	`+})`
`746`	`782`	`})`

Comments

(0)