diff --git a/packages/tres/src/core/useCamera/index.ts b/packages/tres/src/core/useCamera/index.ts index 0fd58b403..2c18232e5 100644 --- a/packages/tres/src/core/useCamera/index.ts +++ b/packages/tres/src/core/useCamera/index.ts @@ -1,7 +1,7 @@ import { useTres } from '/@/core/' import { PerspectiveCamera, OrthographicCamera } from 'three' -import { toRef, watch, Ref } from 'vue' +import { toRef, watch, Ref, inject } from 'vue' export enum CameraType { Perspective = 'Perspective', @@ -105,7 +105,7 @@ let camera: Camera */ export function useCamera(): UseCameraReturn { const { state, setState } = useTres() - + const aspectRatio = inject('aspect-ratio') /** * Create camera and push to Tres `state.cameras` array * @@ -182,10 +182,10 @@ export function useCamera(): UseCameraReturn { function clearCameras() { state.cameras = [] } - - if (state.aspectRatio) { - watch(state.aspectRatio, updateCamera) + if (aspectRatio) { + watch(aspectRatio, updateCamera) } + return { activeCamera: toRef(state, 'camera'), createCamera, diff --git a/packages/tres/src/core/useInstanceCreator/index.ts b/packages/tres/src/core/useInstanceCreator/index.ts index 4b12f9533..6eda00bfc 100644 --- a/packages/tres/src/core/useInstanceCreator/index.ts +++ b/packages/tres/src/core/useInstanceCreator/index.ts @@ -167,8 +167,8 @@ export function useInstanceCreator(prefix: string) { return } else { const vNodeType = ((vnode.type as TresVNodeType).name as string).replace(prefix, '') - const { catalogue: fallback } = useCatalogue() - const catalogue = inject>('catalogue') || fallback + + const catalogue = inject>('catalogue') // check if args prop is defined on the vnode let internalInstance @@ -265,12 +265,12 @@ export function useInstanceCreator(prefix: string) { const { onLoop } = useRenderLoop() const scene = state.scene const raycaster = state.raycaster - const { pushCamera } = useCamera() let instance = createInstance(threeObj, attrs, slots) processProps(attrs, instance) // If the instance is a camera, push it to the camera stack if (instance instanceof PerspectiveCamera || instance instanceof OrthographicCamera) { + const { pushCamera } = useCamera() pushCamera(instance) } diff --git a/packages/tres/src/core/useRenderer/index.ts b/packages/tres/src/core/useRenderer/index.ts index 7e931dbde..a2e5b28a7 100644 --- a/packages/tres/src/core/useRenderer/index.ts +++ b/packages/tres/src/core/useRenderer/index.ts @@ -149,6 +149,8 @@ export function useRenderer(canvas: MaybeElementRef, container: MaybeElementRef, preset = undefined, } = toRefs(options) + const { setState } = useTres() + const { width, height } = resolveUnref(windowSize) ? useWindowSize() : useElementSize(container) const { logError } = useLogger() const { pixelRatio } = useDevicePixelRatio() @@ -212,7 +214,6 @@ export function useRenderer(canvas: MaybeElementRef, container: MaybeElementRef, premultipliedAlpha: resolveUnref(premultipliedAlpha), }) - const { setState } = useTres() setState('renderer', renderer.value) setState('clock', new Clock()) setState('aspectRatio', aspectRatio)