Home > @unseenco/backstage-core > ISheetObject > onValuesChange

ISheetObject.onValuesChange() method

Calls fn every time the value of the props change.

Signature:

onValuesChange(fn: (values: this['value'], meta: SheetObjectValuesChangeMeta) => void, rafDriver?: IRafDriver): VoidFn;

Parameters

Parameter	Type	Description
fn	(values: this['value'], meta: SheetObjectValuesChangeMeta) => void	The callback is called every time the value of the props change, plus once at the beginning.
rafDriver	IRafDriver	(optional) The rafDriver to use. Learn how to use rafDrivers [from the docs](https://backstage.unseen.co/docs/guide/manual/advanced\#rafdrivers).

Returns:

VoidFn

an Unsubscribe function

Example

Usage:

const obj = sheet.object("Box", {position: {x: 0, y: 0}})
const div = document.getElementById("box")

const unsubscribe = obj.onValuesChange((newValues, {variant}) => {
  div.style.left = newValues.position.x + 'px'
  div.style.top = newValues.position.y + 'px'
  console.log('Active variant:', variant)
})

// you can call unsubscribe() to stop listening to changes