useControls
Registers controls and returns their reactive values.
Registers controls and returns an object of Vue refs.
function useControls(
controls: Record<string, unknown>,
options?: { uuid?: string },
): Record<string, Ref<unknown>>
function useControls(
folder: string,
controls: Record<string, unknown>,
options?: { uuid?: string },
): Record<string, Ref<unknown>>
function useControls(
folder: 'fpsgraph',
options?: { uuid?: string },
): Record<string, Ref<unknown>>
The special call useControls('fpsgraph') registers the built-in FPS graph. Its second argument is the options object, not a controls object: use useControls('fpsgraph', { uuid: 'my-panel' }) to add the graph to a specific panel.
Control configuration
interface ControlConfig {
value: unknown
type?: 'select' | 'button' | 'range' | 'boolean' | 'text' | 'number' | 'color' | 'vector' | 'graph'
label?: string
icon?: string
visible?: boolean
min?: number
max?: number
step?: number
format?: (value: number) => string
options?: Array<string | number | { text: string, value: string | number }>
onUpdate?: (values: unknown[]) => void
}
See the controls guide for examples of every control type.