diff --git a/package.json b/package.json index 471eae1..4d5d8d7 100644 --- a/package.json +++ b/package.json @@ -9,13 +9,13 @@ "dependencies": { "gsap": "^3.5.1", "three": "^0.125", - "vue": "3.0.5" + "vue": "^3.0.7" }, "devDependencies": { "@rollup/plugin-buble": "^0.21.3", "@rollup/plugin-replace": "^2.3.3", "@vitejs/plugin-vue": "^1.1.4", - "@vue/compiler-sfc": "^3.0.5", + "@vue/compiler-sfc": "^3.0.7", "eslint": "^7.7.0", "eslint-config-airbnb-base": "^14.2.0", "eslint-config-standard": "^14.1.1", @@ -27,7 +27,7 @@ "rollup-plugin-terser": "^7.0.2", "rollup-plugin-vue": "^6.0.0-beta.10", "sass": "^1.26.10", - "vite": "^2.0.1" + "vite": "^2.0.5" }, "main": "build/trois.js", "module": "build/trois.module.js", diff --git a/src/lights/Light.js b/src/lights/Light.js index 6e016f7..08e123a 100644 --- a/src/lights/Light.js +++ b/src/lights/Light.js @@ -1,15 +1,12 @@ import { Color } from 'three'; -import { inject, watch } from 'vue'; +import { watch } from 'vue'; import { setFromProp } from '../tools.js'; import useBindProp from '../use/useBindProp.js'; export default { inject: { scene: 'scene', - parent: { - from: 'group', - default: () => inject('scene'), - }, + group: { default: null }, }, props: { color: { @@ -29,6 +26,9 @@ export default { }, // can't use setup because it will not be used in sub components // setup() {}, + created() { + this.parent = this.group ? this.group : this.scene; + }, mounted() { useBindProp(this, 'position', this.light.position); diff --git a/src/meshes/Mesh.js b/src/meshes/Mesh.js index ac181e6..33ca980 100644 --- a/src/meshes/Mesh.js +++ b/src/meshes/Mesh.js @@ -1,5 +1,5 @@ import { Mesh } from 'three'; -import { inject, watch } from 'vue'; +import { watch } from 'vue'; import useBindProp from '../use/useBindProp.js'; export default { @@ -7,10 +7,7 @@ export default { three: 'three', scene: 'scene', rendererComponent: 'rendererComponent', - parent: { - from: 'group', - default: () => inject('scene'), - }, + group: { default: null }, }, emits: ['ready'], props: { @@ -25,17 +22,18 @@ export default { }, // can't use setup because it will not be used in sub components // setup() {}, + created() { + this.parent = this.group ? this.group : this.scene; + }, provide() { return { mesh: this, }; }, mounted() { - // console.log('Mesh mounted'); if (this.geometry && !this.mesh) this.initMesh(); }, unmounted() { - // console.log('Mesh unmounted'); if (this.mesh) { this.three.removeIntersectObject(this.mesh); this.parent.remove(this.mesh);