How do I get a threejs object?

[Sayid1]

<template>
  <vgl-namespace ref="namespace" style="height: calc(100% - 60px)">
  <vgl-renderer name="renderer" camera="camera" antialias style="height: 100%">
    <vgl-scene name="scene">
      <vgl-texture name="greenbelt" src="/images/greenbelt.jpg" wrapS="repeat" wrapT="repeat" :repeat="repeat"></vgl-texture>
      <vgl-plane-geometry name="ground" :width="width" :height="height"></vgl-plane-geometry>
      <vgl-mesh-standard-material name="groundMaterial" map="greenbelt"></vgl-mesh-standard-material>
      <vgl-mesh name="ground1" geometry="ground" material="groundMaterial" :rotation="rotation"></vgl-mesh>

      <vgl-texture name="sunflower" src="/images/sunflower.jpg"></vgl-texture>
      <vgl-sprite-material name="sunflowerMaterial" map="sunflower" transparent></vgl-sprite-material>

      <vgl-sprite name="sunflower1" material="sunflowerMaterial" scale="5 10 0" position="10 5 0"></vgl-sprite>

      <vgl-axes-helper :size="50"></vgl-axes-helper>
      <vgl-ambient-light color="#ffeecc"></vgl-ambient-light>
      <vgl-directional-light position="10 11 2"></vgl-directional-light>
    </vgl-scene>
    <vgl-perspective-camera name="camera" :position="cameraPosition"></vgl-perspective-camera>
  </vgl-renderer>
</vgl-namespace>
</template>
<script>
export default {
  mounted () {
    // Contains only renderer, scene and camera object. object3d, geometrys and materials is null
    console.log(this.$resfs.namespace.vglNamespace)
  }
}
</script>

How do I get a threejs mesh and sprite object?
Thanks advance:)

[h-ikeda]

Add ref attribute to the mesh / sprite component and use inst computed property directly to get the threejs object.

<template>
  ...
    <vgl-mesh ref="ground1" geometry="ground" material="groundMaterial" :rotation="rotation"></vgl-mesh>
  ...
</template>

<script>
  export default {
    mounted() {
      console.log(this.$refs.ground1.inst)
    }
  }
</script>

[Sayid1]

Add ref attribute to the mesh / sprite component and use inst computed property directly to get the threejs object.

<template>
  ...
    <vgl-mesh ref="ground1" geometry="ground" material="groundMaterial" :rotation="rotation"></vgl-mesh>
  ...
</template>

<script>
  export default {
    mounted() {
      console.log(this.$refs.ground1.inst)
    }
  }
</script>

I dont't want to it that way. Can't I use vglNamespace to get it?

[Sayid1]

Add ref attribute to the mesh / sprite component and use inst computed property directly to get the threejs object.

<template>
  ...
    <vgl-mesh ref="ground1" geometry="ground" material="groundMaterial" :rotation="rotation"></vgl-mesh>
  ...
</template>

<script>
  export default {
    mounted() {
      console.log(this.$refs.ground1.inst)
    }
  }
</script>

Why not assign the name of the component to the name attribute of the threejs object?
So I can get three objects using getObjectByName

[h-ikeda]

I dont't want to it that way. Can't I use vglNamespace to get it?

Oh, you can.
But VglRenderer component mixes in VglNamespace, and VglNamespace makes hierarchical namespaces. So you have to get namespace from the VglRenderer.

<vgl-renderer ref="namespace" name="renderer" camera="camera" antialias style="height: 100%">

Could this be your way ?