Browse Source

feat(functional): add scopedSlots to context in functional components (#7941)

dev
Eduardo San Martin Morote 6 years ago
committed by Evan You
parent
commit
fb6aa06090
  1. 1
      src/core/vdom/create-functional-component.js
  2. 17
      test/unit/features/options/functional.spec.js
  3. 3
      types/options.d.ts
  4. 1
      types/test/options-test.ts

1
src/core/vdom/create-functional-component.js

@ -48,6 +48,7 @@ export function FunctionalRenderContext (
this.children = children
this.parent = parent
this.listeners = data.on || emptyObject
this.scopedSlots = data.scopedSlots || emptyObject
this.injections = resolveInject(options.inject, parent)
this.slots = () => resolveSlots(children, parent)

17
test/unit/features/options/functional.spec.js

@ -79,6 +79,23 @@ describe('Options functional', () => {
document.body.removeChild(vm.$el)
})
it('should expose data.scopedSlots as scopedSlots', () => {
const vm = new Vue({
template: '<div><wrap><p slot-scope="a">{{ a }}</p></wrap></div>',
components: {
wrap: {
functional: true,
render (h, { scopedSlots, data }) {
expect(data.scopedSlots).toBe(scopedSlots)
return data.scopedSlots.default('a')
}
}
}
}).$mount()
expect(vm.$el.textContent).toBe('a')
})
it('should support returning more than one root node', () => {
const vm = new Vue({
template: `<div><test></test></div>`,

3
types/options.d.ts

@ -1,5 +1,5 @@
import { Vue, CreateElement, CombinedVueInstance } from "./vue";
import { VNode, VNodeData, VNodeDirective } from "./vnode";
import { VNode, VNodeData, VNodeDirective, ScopedSlot } from "./vnode";
type Constructor = {
new (...args: any[]): any;
@ -140,6 +140,7 @@ export interface RenderContext<Props=DefaultProps> {
data: VNodeData;
parent: Vue;
listeners: { [key: string]: Function | Function[] };
scopedSlots: { [key: string]: ScopedSlot };
injections: any
}

1
types/test/options-test.ts

@ -381,6 +381,7 @@ Vue.component('functional-component', {
context.slots();
context.data;
context.parent;
context.scopedSlots;
context.listeners.click;
return createElement("div", {}, context.children);
}

Loading…
Cancel
Save