fix #9

src/lights/Light.js

@@ -4,7 +4,13 @@ import { setFromProp } from '../tools.js';
 import useBindProp from '../use/useBindProp.js';
 
 export default {
-  inject: ['scene'],
+  inject: {
+    scene: 'scene',
+    parent: {
+      from: 'group',
+      default: () => inject('scene'),
+    },
+  },
   props: {
     color: {
       type: String,
@@ -23,9 +29,6 @@ export default {
   },
   // can't use setup because it will not be used in sub components
   // setup() {},
-  created() {
-    this.parent = inject('group', this.scene);
-  },
   mounted() {
     useBindProp(this, 'position', this.light.position);
 

src/meshes/InstancedMesh.js

@@ -11,8 +11,9 @@ export default {
     castShadow: Boolean,
     receiveShadow: Boolean,
   },
-  created() {
-    this.parent = inject('group', this.scene);
+  setup() {
+    const parent = inject('group', inject('scene'));
+    return { parent };
   },
   provide() {
     return {

src/meshes/Mesh.js

@@ -3,7 +3,15 @@ import { inject, watch } from 'vue';
 import useBindProp from '../use/useBindProp.js';
 
 export default {
-  inject: ['three', 'scene', 'rendererComponent'],
+  inject: {
+    three: 'three',
+    scene: 'scene',
+    rendererComponent: 'rendererComponent',
+    parent: {
+      from: 'group',
+      default: () => inject('scene'),
+    },
+  },
   emits: ['ready'],
   props: {
     materialId: String,
@@ -17,9 +25,6 @@ export default {
   },
   // can't use setup because it will not be used in sub components
   // setup() {},
-  created() {
-    this.parent = inject('group', this.scene);
-  },
   provide() {
     return {
       mesh: this,
@@ -55,6 +60,8 @@ export default {
         this.three.addIntersectObject(this.mesh);
       }
 
+      console.log(this.parent);
+
       this.bindProps();
       this.parent.add(this.mesh);
       this.$emit('ready');

src/meshes/Sprite.js

@@ -10,8 +10,9 @@ export default {
     position: Object,
     scale: Object,
   },
-  created() {
-    this.parent = inject('group', this.scene);
+  setup() {
+    const parent = inject('group', inject('scene'));
+    return { parent };
   },
   mounted() {
     this.texture = new TextureLoader().load(this.src, this.onLoaded);