Merge pull request #1 from saraedum/master

use @AsyncComputed decorator

Author: Sharlaan

package.json

@@ -13,7 +13,7 @@
     "detector-webgl": "^2.0.0",
     "three": "^0.104.0",
     "vue": "^2.6.10",
-    "vue-async-computed": "^3.6.1",
+    "vue-async-computed": "https://github.com/saraedum/vue-async-computed.git#5debb7dcd81f52183be55e05b866fc43278a990",
     "vue-class-component": "^7.1.0",
     "vue-color": "^2.7.0",
     "vue-gl": "^0.12.2",

src/components/OrbitControls.vue

@@ -14,14 +14,12 @@
     @Prop() public readonly camera!: Camera;
 
     public get cmr() {
-      // @ts-ignore
       return this.vglNamespace.cameras[this.camera];
     }
 
     @Watch('cmr', { immediate: true })
     public handler(cmr: Camera) {
       const controls = new OrbitControls(cmr);
-      // @ts-ignore
       controls.addEventListener('change', () => this.vglNamespace.update());
     }
   }

src/components/WebglContainer.vue

@@ -78,17 +78,30 @@
 </template>
 
 <script lang="ts">
-// @ts-ignore
-import AsyncComputed from 'vue-async-computed';
+import VueAsyncComputed, { IAsyncComputedProperty } from 'vue-async-computed';
 import { Component, Prop, Vue } from 'vue-property-decorator';
 import { Material, Slider } from 'vue-color';
 import { BufferGeometry, LoadingManager, Vector3 } from 'three';
-// @ts-ignore
 import { STLLoader } from 'three/examples/jsm/loaders/STLLoader';
+import { createDecorator, VueDecorator } from 'vue-class-component';
 
 import OrbitControls from './OrbitControls.vue';
 
-Vue.use(AsyncComputed);
+Vue.use(VueAsyncComputed);
+
+type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
+
+function AsyncComputed<T>(computedOptions?: Omit<IAsyncComputedProperty<T>, 'get'>): VueDecorator {
+  return createDecorator((options, key) => {
+    options.asyncComputed = options.asyncComputed || {};
+    const method = options.methods![key];
+    options.asyncComputed[key] = {
+      get: method,
+      ...computedOptions,
+    } as IAsyncComputedProperty<T>;
+    delete options.methods![key];
+  });
+}
 
 interface IColors {
   hex: string;

src/main.ts

@@ -1,8 +1,6 @@
 import isWebglEnabled from 'detector-webgl';
 import Vue from 'vue';
 import * as VueGL from 'vue-gl';
-// @ts-ignore
-// tslint:disable-next-line
 import App from './App.vue';
 import displayWebGLErrorMessage from './webglError';
 

yarn.lock

@@ -7697,10 +7697,9 @@ [email protected]:
   dependencies:
     indexof "0.0.1"
 
-vue-async-computed@^3.6.1:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/vue-async-computed/-/vue-async-computed-3.6.1.tgz#6b790e2125347c678d1b82b10a5b03b41d7b86d0"
-  integrity sha512-8FFDTqfdvKrzK5Fr7nNHZgP6sQ2hTUELTrLn25i8VW/g06MztD+FOe1gs0RYVpRkPlcrykf2hbJxNYra1c4OGg==
+"vue-async-computed@https://github.com/saraedum/vue-async-computed.git#5debb7dcd81f52183be55e05b866fc43278a990":
+  version "3.5.0"
+  resolved "https://github.com/saraedum/vue-async-computed.git#5debb7dcd81f52183be55e05b866fc43278a9905"
 
 vue-class-component@^7.0.1:
   version "7.0.2"