diff --git a/package.json b/package.json index f1f8318..31fcbed 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "troisjs", - "version": "0.1.7", + "version": "0.1.8", "scripts": { "dev": "vite", "build": "vite build", diff --git a/src/core/Group.js b/src/core/Group.js index 9b39f2f..e66f119 100644 --- a/src/core/Group.js +++ b/src/core/Group.js @@ -1,28 +1,30 @@ import { Group } from 'three'; -import { inject } from 'vue'; import useBindProp from '../use/useBindProp.js'; export default { - inject: ['three', 'scene'], + inject: { + three: 'three', + scene: 'scene', + group: { default: null }, + }, props: { position: Object, rotation: Object, scale: Object, }, - setup(props) { - const parent = inject('group', inject('scene')); - const group = new Group(); - useBindProp(props, 'position', group.position); - useBindProp(props, 'rotation', group.rotation); - useBindProp(props, 'scale', group.scale); - return { parent, group }; - }, provide() { return { group: this.group, }; }, created() { + this.parent = this.group ? this.group : this.scene; + + this.group = new Group(); + useBindProp(this, 'position', this.group.position); + useBindProp(this, 'rotation', this.group.rotation); + useBindProp(this, 'scale', this.group.scale); + this.parent.add(this.group); }, unmounted() { diff --git a/src/meshes/InstancedMesh.js b/src/meshes/InstancedMesh.js index 8a930ac..43d3bc1 100644 --- a/src/meshes/InstancedMesh.js +++ b/src/meshes/InstancedMesh.js @@ -1,9 +1,13 @@ import { InstancedMesh } from 'three'; -import { inject, watch } from 'vue'; +import { watch } from 'vue'; import useBindProp from '../use/useBindProp.js'; export default { - inject: ['three', 'scene'], + inject: { + three: 'three', + scene: 'scene', + group: { default: null }, + }, props: { materialId: String, count: Number, @@ -11,15 +15,14 @@ export default { castShadow: Boolean, receiveShadow: Boolean, }, - setup() { - const parent = inject('group', inject('scene')); - return { parent }; - }, provide() { return { mesh: this, }; }, + created() { + this.parent = this.group ? this.group : this.scene; + }, beforeMount() { if (!this.$slots.default) { console.error('Missing Geometry'); diff --git a/src/meshes/Sprite.js b/src/meshes/Sprite.js index c28acd3..9bfac89 100644 --- a/src/meshes/Sprite.js +++ b/src/meshes/Sprite.js @@ -1,18 +1,20 @@ import { Sprite, SpriteMaterial, TextureLoader } from 'three'; -import { inject } from 'vue'; import useBindProp from '../use/useBindProp.js'; export default { emits: ['ready', 'loaded'], - inject: ['three', 'scene'], + inject: { + three: 'three', + scene: 'scene', + group: { default: null }, + }, props: { src: String, position: Object, scale: Object, }, - setup() { - const parent = inject('group', inject('scene')); - return { parent }; + created() { + this.parent = this.group ? this.group : this.scene; }, mounted() { this.texture = new TextureLoader().load(this.src, this.onLoaded);