Skip to main content

Hooks

Pixi React now support React hooks 🌟

Pixi Hooks rely on React Context and must be called inside an AppProvider. This provider is created automatically for you when using the Stage component, but will need to be added manually if using the createRoot or render APIs.

useApp​

Access the PIXI.Application in your component

import { useApp } from '@pixi/react'

function MyComponent () {
  const app = useApp()
  // app => PIXI.Application

  return (
    ...
  )
}

useTick​

Bind listener to the PIXI.Application ticker event

import { useTick } from '@pixi/react'

function MyComponent () {
  useTick(delta => {
    // do something here
  })

  return (
    ...
  )
}

Example: