Global

Methods

App() → {HTMLCanvasElement}

Returns a JSX element with a R3F canvas.

In R3F, useRef() can be used to encapsulate a reference to an instance of an object, as its current value.
This reference can then be passed to a component as a prop.
Source:
Returns:
R3F Canvas.
Type
HTMLCanvasElement

Box(props) → {ThreeElements}

Box component.
Parameters:
Name Type Description
props Object information that you pass to a JSX tag.
Properties
Name Type Description
position Array.<Number> box position.
name String box name.
Source:
Returns:
view as regular three.js elements expressed in JSX.
Type
ThreeElements

useEffect()

React useState hook is asynchronous!

Basically, you don't get update value right after updating state.

The useEffect hook executes after the function returns the generated component instance within it, which means that any ref or state will be assigned before the useEffect hook gets called.

This code will always use the latest value of clicked, which will be used in the next draw.

Source:
See: