+ correctly expose "methods"-option to recover compatibility to vue-class-component

Author: tall1on

src/component.ts

@@ -79,7 +79,7 @@ function buildComponent(cons: Cons, arg: ComponentOption, extend?: any): any {
     const option = ComponentOption(cons, extend)
     const slot = obtainSlot(cons.prototype)
     Object.keys(arg).reduce<Record<string, any>>((option, name: string) => {
-        if (['options', 'modifier', 'emits', 'setup', 'provide'].includes(name)) {
+        if (['options', 'modifier', 'methods', 'emits', 'setup', 'provide'].includes(name)) {
             return option
         }
         option[name] = arg[name as keyof ComponentOption]
@@ -93,12 +93,11 @@ function buildComponent(cons: Cons, arg: ComponentOption, extend?: any): any {
     }
     option.emits = emits
 
-    //apply methods
-    let methods = Object.fromEntries(slot.obtainMap('methods'))
+    //merge methods
     if ('object' === typeof arg.methods && !Array.isArray(arg.methods) && arg.methods !== null) {
-        methods = Object.assign(methods, arg.methods);
+        option.methods??={}
+        Object.assign(option.methods, arg.methods);
     }
-    option.methods = methods
 
     //merge setup function
     if (!option.setup) {

src/option/emit.ts

@@ -18,12 +18,10 @@ export function build(cons: Cons, optionBuilder: OptionBuilder) {
         return
     }
     const emits = slot.obtainMap('emits')
-    const methods = slot.obtainMap('methods')
     names.forEach((value, key) => {
         const eventName = value === null ? key : value
         emits.set(eventName, true)
-
-        const emitFunction = async function (this: any) {
+        optionBuilder.methods![key] = async function (this: any) {
 
             const ret = proto[key].apply(this, arguments)
             if (ret instanceof Promise) {
@@ -34,7 +32,6 @@ export function build(cons: Cons, optionBuilder: OptionBuilder) {
                 this.$emit(eventName, ret)
             }
         }
-        optionBuilder.methods![key] = emitFunction
-        methods.set(key, emitFunction)
     })
+
 }

src/option/methodsAndHooks.ts

@@ -33,7 +33,6 @@ export function build(cons: Cons, optionBuilder: OptionBuilder) {
     const slot = obtainSlot(cons.prototype)
     const protoArr = toComponentReverse(cons.prototype)
     const hookMap = slot.obtainMap('hooks')
-    const methodsMap = slot.obtainMap('methods')
 
     optionBuilder.hooks ??= {}
     optionBuilder.methods ??= {}
@@ -48,14 +47,13 @@ export function build(cons: Cons, optionBuilder: OptionBuilder) {
             //watch, user may call watch method directly
             //hooks, user may call hook method directly
             //emits, user may have a method name which is same as one of event names
-            return !['methods', 'watch', 'hooks', 'emits', 'provide'].includes(mapName)
+            return !['watch', 'hooks', 'emits', 'provide'].includes(mapName)
         });
         names.forEach(name => {
             if (HookNames.includes(name) || hookMap.has(name)) {
                 HookFunctions[name] = proto[name]
             } else {
                 MethodFunctions[name] = proto[name]
-                methodsMap.set(name, proto[name])
             }
         })
     })

src/utils.ts

@@ -28,7 +28,6 @@ export type SlotMapTypes = {
     ref: Map<string, RefConfig>
     setup: Map<string, SetupConfig>
     customDecorator: Map<string, CustomDecoratorRecord[]>
-    methods: Map<string, Function>
 }
 
 class Slot {