From 88be7ecd37b174bff8fd8a902018501e9da80d71 Mon Sep 17 00:00:00 2001 From: Evan You Date: Wed, 3 Oct 2018 13:00:13 -0400 Subject: [PATCH] refactor: adjust render fn signature --- packages/core/__tests__/attrsFallthrough.spec.ts | 8 ++++---- packages/core/src/component.ts | 6 ++++-- packages/core/src/componentOptions.ts | 9 ++++++++- packages/core/src/componentUtils.ts | 11 +++++------ packages/core/src/createRenderer.ts | 13 +++++++++++-- packages/core/src/errorHandling.ts | 6 ++---- 6 files changed, 34 insertions(+), 19 deletions(-) diff --git a/packages/core/__tests__/attrsFallthrough.spec.ts b/packages/core/__tests__/attrsFallthrough.spec.ts index dae88be1..73ef657e 100644 --- a/packages/core/__tests__/attrsFallthrough.spec.ts +++ b/packages/core/__tests__/attrsFallthrough.spec.ts @@ -31,14 +31,14 @@ describe('attribute fallthrough', () => { updated() { childUpdated() } - render(props: any) { + render() { return h( 'div', { class: 'c2', style: { fontWeight: 'bold' } }, - props.foo + this.$props.foo ) } } @@ -103,14 +103,14 @@ describe('attribute fallthrough', () => { updated() { childUpdated() } - render(props: any) { + render() { return h( 'div', { class: 'c2', style: { fontWeight: 'bold' } }, - props.foo + this.$props.foo ) } } diff --git a/packages/core/src/component.ts b/packages/core/src/component.ts index d8ff5ebd..3cd9ea97 100644 --- a/packages/core/src/component.ts +++ b/packages/core/src/component.ts @@ -1,11 +1,13 @@ import { EMPTY_OBJ } from './utils' +import { createElement } from './h' import { VNode, Slots, RenderNode, MountedVNode } from './vdom' import { Data, RenderFunction, ComponentOptions, ComponentPropsOptions, - WatchOptions + WatchOptions, + RenderContext } from './componentOptions' import { setupWatcher } from './componentWatch' import { Autorun, DebuggerEvent, ComputedGetter } from '@vue/observer' @@ -40,7 +42,7 @@ export interface MountedComponent $children: MountedComponent[] $options: ComponentOptions - render(props: P, slots: Slots, attrs: Data): any + render(h: createElement, ctx: RenderContext

): any renderError?(e: Error): any renderTracked?(e: DebuggerEvent): void renderTriggered?(e: DebuggerEvent): void diff --git a/packages/core/src/componentOptions.ts b/packages/core/src/componentOptions.ts index 4cdfcb3e..800ce63b 100644 --- a/packages/core/src/componentOptions.ts +++ b/packages/core/src/componentOptions.ts @@ -1,10 +1,17 @@ +import { createElement } from './h' import { Slots } from './vdom' import { MountedComponent } from './component' export type Data = Record +export interface RenderContext

{ + props: P + slots: Slots + attrs: Data +} + export interface RenderFunction

{ - (props: P, slots: Slots, attrs: Data): any + (h: createElement, ctx: RenderContext

): any } export interface ComponentOptions { diff --git a/packages/core/src/componentUtils.ts b/packages/core/src/componentUtils.ts index 8456988f..1a307510 100644 --- a/packages/core/src/componentUtils.ts +++ b/packages/core/src/componentUtils.ts @@ -56,12 +56,11 @@ export function createComponentInstance( export function renderInstanceRoot(instance: MountedComponent): VNode { let vnode try { - vnode = instance.render.call( - instance.$proxy, - instance.$props, - instance.$slots, - instance.$attrs - ) + vnode = instance.render.call(instance.$proxy, h, { + props: instance.$props, + slots: instance.$slots, + attrs: instance.$attrs + }) } catch (e1) { handleError(e1, instance, ErrorTypes.RENDER) if (__DEV__ && instance.renderError) { diff --git a/packages/core/src/createRenderer.ts b/packages/core/src/createRenderer.ts index d737ea1a..aee6bd1c 100644 --- a/packages/core/src/createRenderer.ts +++ b/packages/core/src/createRenderer.ts @@ -1,3 +1,4 @@ +import { h } from './h' import { autorun, stop } from '@vue/observer' import { queueJob } from '@vue/scheduler' import { VNodeFlags, ChildrenFlags } from './flags' @@ -237,7 +238,11 @@ export function createRenderer(options: RendererOptions) { const render = tag as FunctionalComponent const { props, attrs } = resolveProps(data, render.props) const subTree = (vnode.children = normalizeComponentRoot( - render(props, slots || EMPTY_OBJ, attrs || EMPTY_OBJ), + render(h, { + props, + slots: slots || EMPTY_OBJ, + attrs: attrs || EMPTY_OBJ + }), vnode, attrs, render.inheritAttrs @@ -525,7 +530,11 @@ export function createRenderer(options: RendererOptions) { if (shouldUpdate) { const { props, attrs } = resolveProps(nextData, render.props) const nextTree = (nextVNode.children = normalizeComponentRoot( - render(props, nextSlots || EMPTY_OBJ, attrs || EMPTY_OBJ), + render(h, { + props, + slots: nextSlots || EMPTY_OBJ, + attrs: attrs || EMPTY_OBJ + }), nextVNode, attrs, render.inheritAttrs diff --git a/packages/core/src/errorHandling.ts b/packages/core/src/errorHandling.ts index 464f628e..9294ab50 100644 --- a/packages/core/src/errorHandling.ts +++ b/packages/core/src/errorHandling.ts @@ -58,10 +58,8 @@ export function handleError( function logError(err: Error, instance: MountedComponent, type: ErrorTypes) { if (__DEV__) { const info = ErrorTypeStrings[type] - console.warn( - `Unhandled error${info ? ` in ${info}` : ``}: "${err.toString()}"`, - instance - ) + console.warn(`Unhandled error${info ? ` in ${info}` : ``}:`) + console.error(err) } else { throw err }