---

title: useAnimations sourcecode: src/core/useAnimations.tsx

<Grid cols={4}> <li> <Codesandbox id="pecl6" /> </li> </Grid>

A hook that abstracts AnimationMixer.

const { nodes, materials, animations } = useGLTF(url)
const { ref, mixer, names, actions, clips } = useAnimations(animations)
useEffect(() => {
  actions?.jump.play()
})
return (
  <mesh ref={ref} />

The hook can also take a pre-existing root (which can be a plain object3d or a reference to one):

const { scene, animations } = useGLTF(url)
const { actions } = useAnimations(animations, scene)
return <primitive object={scene} />