apply props before calling data function

Author: ruojianll

src/component.ts

@@ -11,8 +11,9 @@ import { build as optionEmit } from './option/emit'
 import { build as optionVModel, VModelConfig } from './option/vmodel'
 import { build as optionAccessor } from './option/accessor'
 import { OptionBuilder } from './optionBuilder'
-
-export interface Cons { new(): any, prototype: any }
+import type { VueCons } from './index'
+export type Cons = VueCons
+// export interface Cons { new(): any, prototype: any }
 function ComponentOption(cons: Cons, extend?: any) {
     const optionBuilder: OptionBuilder = {}
     optionVModel(cons, optionBuilder)
@@ -26,8 +27,8 @@ function ComponentOption(cons: Cons, extend?: any) {
     optionAccessor(cons, optionBuilder)
     const raw = {
         data() {
-            const optionBuilder: OptionBuilder = {}
-            optionData(cons, optionBuilder)
+            delete optionBuilder.data
+            optionData(cons, optionBuilder, this)
             return optionBuilder.data ?? {}
         },
         methods: optionBuilder.methods,

src/index.ts

@@ -11,6 +11,7 @@ export { decorator as Hook } from './option/methodsAndHooks'
 import type {
     ComponentPublicInstance
 } from 'vue'
+import type { OptionBuilder } from './optionBuilder'
 const IdentifySymbol = Symbol('vue-facing-decorator-identify')
 export interface BaseTypeIdentify {
     [IdentifySymbol]: undefined
@@ -19,15 +20,25 @@ export function TSX<Properties extends {} = {}, Events extends {} = {}>() {
 
 
     type Bundle = Properties & { [index in keyof Events as `on${Capitalize<index & string>}`]: Events[index] extends Function ? Events[index] : { (param: Events[index]): any } }
-    return function <C extends { new(): ComponentPublicInstance & BaseTypeIdentify }>(cons: C) {
+    return function <C extends VueCons>(cons: C) {
         return cons as unknown as {
             new(): Omit<ComponentPublicInstance<(InstanceType<C>['$props']) & Bundle>, keyof Bundle> & InstanceType<C>//& ComponentPublicInstance & BaseTypeIdentify
         }
     }
 }
 
-export const Base = class { } as {
-    new(): ComponentPublicInstance & BaseTypeIdentify
+export type VueCons  = {
+    new(optionBuilder: OptionBuilder, vueInstance: any): ComponentPublicInstance & BaseTypeIdentify
 }
-export const Vue = Base
 
+export const Base = class {
+    constructor(optionBuilder: OptionBuilder, vueInstance: any) {
+        const props = optionBuilder.props
+        if (props) {
+            Object.keys(props).forEach(key => {
+                (this as any)[key] = vueInstance[key]
+            })
+        }
+    }
+} as VueCons
+export const Vue = Base

src/option/data.ts

@@ -2,14 +2,12 @@ import { makeObject } from '../utils'
 import { Cons } from '../component'
 import { OptionBuilder } from '../optionBuilder'
 import { obtainSlot, excludeNames, getValidNames } from '../utils'
-export function build(cons: Cons, optionBuilder: OptionBuilder) {
+export function build(cons: Cons, optionBuilder: OptionBuilder, vueInstance: any, propNames?: string[]) {
     optionBuilder.data ??= {}
-    const sample = new cons
-
+    const sample = new cons(optionBuilder, vueInstance)
     let names = getValidNames(sample, (des) => {
         return !!des.enumerable
     })
-
     const slot = obtainSlot(cons.prototype)
     names = excludeNames(names, slot)
     Object.assign(optionBuilder.data, makeObject(names, sample))

test/option/accessor.ts

@@ -2,7 +2,6 @@
 import { mount } from '@vue/test-utils'
 import { expect } from 'chai';
 import 'mocha';
-import { wrap } from 'module';
 import { Component, Base ,Vanilla} from '../../dist'
 
 @Component

test/option/data.ts

@@ -1,21 +1,32 @@
 
 import { expect } from 'chai';
 import 'mocha';
-import { Component, Ref, Base } from '../../dist'
+import { Component, Base, Prop } from '../../dist'
+import { mount } from '@vue/test-utils'
 
 @Component
 export class Comp extends Base {
-    data='data value'
-
+    data = 'data value'
+    @Prop
+    prop!: string
+    fieldInitProp = this.prop
 }
+
 const CompContext = Comp as any
 
 describe('option data',
     () => {
         it('default', () => {
+            const vm = mount(CompContext, {
+                props: {
+                    prop:'prop test'
+                }
+            }).vm
+
             expect('function').to.equal(typeof CompContext?.data)
             expect('data value').to.equal(CompContext.data().data)
-            expect(1).to.equal(Object.keys(CompContext.data()).length)
+            expect(2).to.equal(Object.keys(CompContext.data()).length)
+            expect('prop test').to.equal(vm.fieldInitProp)
         })
     }
 )