refactor: adjust render fn signature

This commit is contained in:
Evan You 2018-10-03 13:00:13 -04:00
parent 172b7f5cf7
commit 88be7ecd37
6 changed files with 34 additions and 19 deletions

View File

@ -31,14 +31,14 @@ describe('attribute fallthrough', () => {
updated() { updated() {
childUpdated() childUpdated()
} }
render(props: any) { render() {
return h( return h(
'div', 'div',
{ {
class: 'c2', class: 'c2',
style: { fontWeight: 'bold' } style: { fontWeight: 'bold' }
}, },
props.foo this.$props.foo
) )
} }
} }
@ -103,14 +103,14 @@ describe('attribute fallthrough', () => {
updated() { updated() {
childUpdated() childUpdated()
} }
render(props: any) { render() {
return h( return h(
'div', 'div',
{ {
class: 'c2', class: 'c2',
style: { fontWeight: 'bold' } style: { fontWeight: 'bold' }
}, },
props.foo this.$props.foo
) )
} }
} }

View File

@ -1,11 +1,13 @@
import { EMPTY_OBJ } from './utils' import { EMPTY_OBJ } from './utils'
import { createElement } from './h'
import { VNode, Slots, RenderNode, MountedVNode } from './vdom' import { VNode, Slots, RenderNode, MountedVNode } from './vdom'
import { import {
Data, Data,
RenderFunction, RenderFunction,
ComponentOptions, ComponentOptions,
ComponentPropsOptions, ComponentPropsOptions,
WatchOptions WatchOptions,
RenderContext
} from './componentOptions' } from './componentOptions'
import { setupWatcher } from './componentWatch' import { setupWatcher } from './componentWatch'
import { Autorun, DebuggerEvent, ComputedGetter } from '@vue/observer' import { Autorun, DebuggerEvent, ComputedGetter } from '@vue/observer'
@ -40,7 +42,7 @@ export interface MountedComponent<D = Data, P = Data>
$children: MountedComponent[] $children: MountedComponent[]
$options: ComponentOptions<D, P> $options: ComponentOptions<D, P>
render(props: P, slots: Slots, attrs: Data): any render(h: createElement, ctx: RenderContext<P>): any
renderError?(e: Error): any renderError?(e: Error): any
renderTracked?(e: DebuggerEvent): void renderTracked?(e: DebuggerEvent): void
renderTriggered?(e: DebuggerEvent): void renderTriggered?(e: DebuggerEvent): void

View File

@ -1,10 +1,17 @@
import { createElement } from './h'
import { Slots } from './vdom' import { Slots } from './vdom'
import { MountedComponent } from './component' import { MountedComponent } from './component'
export type Data = Record<string, any> export type Data = Record<string, any>
export interface RenderContext<P> {
props: P
slots: Slots
attrs: Data
}
export interface RenderFunction<P = Data> { export interface RenderFunction<P = Data> {
(props: P, slots: Slots, attrs: Data): any (h: createElement, ctx: RenderContext<P>): any
} }
export interface ComponentOptions<D = Data, P = Data> { export interface ComponentOptions<D = Data, P = Data> {

View File

@ -56,12 +56,11 @@ export function createComponentInstance(
export function renderInstanceRoot(instance: MountedComponent): VNode { export function renderInstanceRoot(instance: MountedComponent): VNode {
let vnode let vnode
try { try {
vnode = instance.render.call( vnode = instance.render.call(instance.$proxy, h, {
instance.$proxy, props: instance.$props,
instance.$props, slots: instance.$slots,
instance.$slots, attrs: instance.$attrs
instance.$attrs })
)
} catch (e1) { } catch (e1) {
handleError(e1, instance, ErrorTypes.RENDER) handleError(e1, instance, ErrorTypes.RENDER)
if (__DEV__ && instance.renderError) { if (__DEV__ && instance.renderError) {

View File

@ -1,3 +1,4 @@
import { h } from './h'
import { autorun, stop } from '@vue/observer' import { autorun, stop } from '@vue/observer'
import { queueJob } from '@vue/scheduler' import { queueJob } from '@vue/scheduler'
import { VNodeFlags, ChildrenFlags } from './flags' import { VNodeFlags, ChildrenFlags } from './flags'
@ -237,7 +238,11 @@ export function createRenderer(options: RendererOptions) {
const render = tag as FunctionalComponent const render = tag as FunctionalComponent
const { props, attrs } = resolveProps(data, render.props) const { props, attrs } = resolveProps(data, render.props)
const subTree = (vnode.children = normalizeComponentRoot( 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, vnode,
attrs, attrs,
render.inheritAttrs render.inheritAttrs
@ -525,7 +530,11 @@ export function createRenderer(options: RendererOptions) {
if (shouldUpdate) { if (shouldUpdate) {
const { props, attrs } = resolveProps(nextData, render.props) const { props, attrs } = resolveProps(nextData, render.props)
const nextTree = (nextVNode.children = normalizeComponentRoot( 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, nextVNode,
attrs, attrs,
render.inheritAttrs render.inheritAttrs

View File

@ -58,10 +58,8 @@ export function handleError(
function logError(err: Error, instance: MountedComponent, type: ErrorTypes) { function logError(err: Error, instance: MountedComponent, type: ErrorTypes) {
if (__DEV__) { if (__DEV__) {
const info = ErrorTypeStrings[type] const info = ErrorTypeStrings[type]
console.warn( console.warn(`Unhandled error${info ? ` in ${info}` : ``}:`)
`Unhandled error${info ? ` in ${info}` : ``}: "${err.toString()}"`, console.error(err)
instance
)
} else { } else {
throw err throw err
} }