🐛 Bind methods accessed by data

Consider a component like this:

```typescript
@component
class MyComponent {
  foo = 'foo'
  options = {
    handler = this.method,
  }

  method() {
    return this.foo
  }
}
```

When we call `options.handler()`, we would expect to get back `foo`,
but this currently doesn't work, because the methods aren't correctly
bound in the data builder function.

This change actively binds the functions to the Vue component instance,
so that the above example works as expected.

Author: alecgibson

src/index.ts

@@ -40,10 +40,16 @@ export const Base = class {
             })
         }
 
+        const methods = optionBuilder.methods
+        if (methods) {
+            Object.keys(methods).forEach(key => {
+                (this as any)[key] = methods[key].bind(vueInstance)
+            })
+        }
     }
 
 } as VueCons
 
 export const Vue = Base
 
-export { toNative } from './component'
+export { toNative } from './component'

src/option/data.ts

@@ -4,9 +4,9 @@ import { makeObject, obtainSlot, excludeNames, getValidNames } from '../utils'
 
 export function build(cons: Cons, optionBuilder: OptionBuilder, vueInstance: any) {
     optionBuilder.data ??= {}
-    const sample = new cons(optionBuilder,vueInstance)
-    let names = getValidNames(sample, (des) => {
-        return !!des.enumerable
+    const sample = new cons(optionBuilder, vueInstance) as any
+    let names = getValidNames(sample, (des, name) => {
+        return !!des.enumerable && !optionBuilder.methods?.[name]
     })
     const slot = obtainSlot(cons.prototype)
     names = excludeNames(names, slot)

test/option/data.ts

@@ -11,6 +11,16 @@ class Comp extends Base {
     @Prop
     prop!: string
     fieldInitProp = this.prop //not work
+
+    methods = [this.method];
+    options = {
+        handler: this.method,
+    }
+    wrapped = () => this.method();
+
+    method() {
+        return this.data
+    }
 }
 
 const CompContext = toNative(Comp) as any
@@ -25,9 +35,16 @@ describe('option data',
 
             expect('function').to.equal(typeof CompContext?.data)
             expect('data value').to.equal(CompContext.data().data)
-            expect(2).to.equal(Object.keys(CompContext.data()).length)
+            expect(5).to.equal(Object.keys(CompContext.data()).length)
             // expect('prop test').to.equal(vm.fieldInitProp)
         })
+
+        it('binds methods to the component context', () => {
+            const {vm} = mount(CompContext)
+            expect('data value').to.equal(vm.methods[0]())
+            expect('data value').to.equal(vm.options.handler())
+            expect('data value').to.equal(vm.wrapped())
+        })
     }
 )
 export default {}