threlte logo
Basics

Hooks

Hooks allow you to tie or request specific information to your component. For instance, components that want to participate in the unified frame loop can use useFrame, components that need to be informed of your main Threlte application context can use useThrelte and so on. All hooks clean up after themselves once the component unmounts and can only be used in a child of the <Canvas> component.

Here is an overview of the @theatre/core hooks:

  • useThrelte - gain access to the core ThreeJS context, including renderer, scene, camera and more.
  • useFrame - allows hooking into the core frameloop, enable animations and other dynamic behavior.
  • useRender - allows hooking into the rendering process and even hook custom postprocessing into your app.
  • useLoader - load data with an arbitrary ThreeJS loader classes.

A variety of other hooks are provided by the other Threlte package. See the reference documentation to discover more hooks.