Link

A Link can be directly created using the useLink hook or indirectly through other hooks like useScroll, or useAudio. Links can be used inside the animate property and allow for reactive animations outside of the React render loop. A link can be called as a function, either with no arguments, returning the currently stored value, or with a computation function. In which case it will return another Link which when called without arguments returns the computed value. This is useful when using a link to animate a property which requires a certain formatting, such as the translate property.

Call signature

1 
2 
3 
const computed = link<T = any>(computation);

const value = link<T = any>();

Parameters

computation?: (<P = any>(value: T, index: number) => P)[]

A function which takes in the Link value and an optional index which represents the current element being animated inside staggering animations.

Returns

computed Link<P>

value T

Methods

subscribe(): ((callback: (options: ClipConfig) => void) => void)[]

Attach an event listener callback to the link to listen for changes.

unsubscribe(): ((callback: (options: ClipConfig) => void) => void)[]

Detach an event listener callback from the link.

set(): ((value: T, options?: ClipConfig) => void)[]

Update the value of the link. When options are specified the value will automatically animate using the specified ClipConfig.