Entity

The Entity component is the fundamental building block in PlayCanvas React applications. It represents a node in the scene graph hierarchy and can contain other entities as children, as well as components that define its behavior and appearance.

Usage


import { Entity } from '@playcanvas/react'
 
export default function Scene() {
  return (
    <Entity >
      <Entity name="child" />
      <Entity name="other-child" >
        <Entity name="nested-child" >
      </Entity>
    </Entity>
  )
}

Entities on their own are not visible, they need components to have behaviour. You can add components to an entity by nesting them within the Entity component.

Props

The following props are based on the Entity API from PlayCanvas version 2.3.3. This documentation is automatically generated from the TypeScript types of the installed PlayCanvas package.

Name	Type	Default
`name`	`string` The name of the entity	`"Untitled"`
`position`	`[number, number, number]` The local position of the entity relative to its parent. You can use the `position` prop to set the position of the entity.	`[0, 0, 0]`
`scale`	`[number, number, number]` The local scale of the entity relative to its parent. You can use the `scale` prop to set the scale of the entity.	`[1, 1, 1]`
`rotation`	`[number, number, number, number?]` The local rotation of the entity relative to its parent. The rotation is specified as a quaternion or euler angles.	`[0, 0, 0]`
`onPointerUp`	`PointerEventCallback` The callback for the pointer up event	`null`
`onPointerDown`	`PointerEventCallback` The callback for the pointer down event	`null`
`onPointerOver`	`PointerEventCallback` The callback for the pointer over event	`null`
`onPointerOut`	`PointerEventCallback` The callback for the pointer out event	`null`
`onClick`	`MouseEventCallback` The callback for the click event	`null`
`children`	`ReactNode`
`c`	`{ [x: string]: Component; }` Component storage.
`tags`	`Tags` Interface for tagging graph nodes. Tag based searches can be performed using the GraphNode#findByTag function.
`scaleCompensation`	`boolean`
`enabled`	`boolean` Sets the enabled state of the GraphNode. If one of the GraphNode’s parents is disabled there will be no other side effects. If all the parents are enabled then the new value will activate or deactivate all the enabled children of the GraphNode. Gets the enabled state of the GraphNode.
`ref`	`Ref<Entity> \| undefined` Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).
`key`	`Key \| null \| undefined`