| derived(fn) |
Returns a ReadonlyRef whose value will always point to the latest result of the given function. The function will only be executed once per set of values. |
| effect(fn) |
Sometimes your components will need to initiate side effects to start fetching data, etc. This function enables you to implement that behaviour. The provided effect will be observed and will run automatically whenever any of its tracked values change. It will automatically be invalidated when the component is unmounted.The function passed into effect will behave similarly to one that is passed to Reacts useEffect in that it won’t be executed during server side rendering. |
| fromHook(fn) |
The function passed to fromHook will always be executed when rendering the component. |
| inject(context) |
Injects a React.Context into a Reactive Function Component. |
| memoize(fn, controller) |
Returns a function that is only executed again if any of its tracked values have changed. The controller can be used to establish a notification system and is largely irrelevant to end users of the API. |
| r(render) |
This function is a pure type-cast to avoid TypeScript from complaining when using a Reactive Function Component without wrap(). |
| reactive(initialValue) |
Transforms an object into a tracked version. Changing the object returned from reactive will also change the original. All watchers and derived values will update. Access to Object.keys as well as checking for the existance of a key through the in operator will also be tracked. |
| readonly(ref) |
Converts a mutable Ref to a ReadonlyRef. |
| ref(initialValue) |
Creates a new tracked reference value. |
| toRef(store, prop) |
Extracts a single property from a tracked object into a RefObject. |
| toRefs(store) |
Converts a tracked object into an object of Ref instances. |
| useRefValue(ref) |
Returns the current value of a RefObject and starts to track its value once the component has been mounted.An update will be scheduled if the value of the reference has changed between the first render of the component and mounting it. |
| watchEffect(fn) |
Executes the given effect immediately and tracks any used values. When any of them change, it will execute the effect again. If a teardown function has been registered through the onInvalidate param, it will be executed before the effect is executed again, allowing for cleanup. |
| wrap(construct) |
Converts a Reactive Function Component into a React Function Component. A Reactive Function Component returns a render function which is automatically tracked. If none of its input values have changed, the render function will not execute during consequitive renderings of the component. Instead, the old virtual DOM tree will be returned, enabling frameworks like React and Preact to bail out of rendering early on.It is usually a better developer experience to configure your Build tool to use @pago/reactive as the @jsxImportSource or the @jsxFactory. |