refactor: 修改函数组件传参为对象context(影响较大)

yanyunwu · Oct 3, 2022 · e990775 · e990775
1 parent 81adf71
commit e990775
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/src/render.ts b/src/render.ts
@@ -30,6 +30,7 @@ import {
   VComponentSymbol
 } from "./vnode";
 import {ComponentLifeCycle, createClassComponentLife} from "./lifeCycle";
+import {appUtils} from "./plugin";
 
 /**
  * 传说中的render函数
@@ -186,9 +187,12 @@ function renderComponent(component: ComponentType, props: VNodeProps, children:
   ) {
     let ClassComponent = component as ClassComponentType
     let result = new ClassComponent(componentProps, children)
+
     result.props = componentProps
     result.children = children
+
     let lifeCycle = createClassComponentLife(result)
+
     let vn = result.render(renderApi)
     lifeCycle.emit('created')
     let vc: VComponent = {
@@ -206,7 +210,7 @@ function renderComponent(component: ComponentType, props: VNodeProps, children:
   } else {
     let FunctionComponent = component as FunctionComponentType
     let lifeCycle = new ComponentLifeCycle()
-    let vn = FunctionComponent(componentProps, children, lifeCycle)
+    let vn = FunctionComponent({props: componentProps, children: children, life: lifeCycle, utils: appUtils})
     lifeCycle.emit('created')
     let vc: VComponent =  {
       type: VComponentSymbol,

diff --git a/src/vnode/component.ts b/src/vnode/component.ts
@@ -1,11 +1,18 @@
 import {VNode, VNODE_TYPE, OriginVNode, VNodeProps} from "./vnode";
 import { ComponentLifeCycle } from '../lifeCycle'
 import { ComponentInstance } from '../component'
+import {AppUtils} from '../plugin'
 
+export interface ComponentContext {
+  props: Record<string, any>
+  children: Array<VNode>
+  life: ComponentLifeCycle
+  utils: AppUtils
+}
 
 /** 函数组件类型 */
 export interface FunctionComponentType {
-  (props: Record<string, any>, children: Array<VNode>, life: ComponentLifeCycle): OriginVNode
+  (context: ComponentContext): OriginVNode
 }
 
 /** 类组件类型 */