The computeRef function allows you to create a computed ref object that automatically computes its value based on a source ref object and a computation function. This is useful for deriving values from reactive data and ensuring that the computed ref updates whenever the source ref changes.
To create a computed ref using computeRef, you provide a source ref and a computation function. The computation function calculates the computed value based on the value of the source ref, and the computed ref will automatically update when the source ref changes.
import { computeRef, ref } from 'regor'
const myRef = ref(5)
// Create a computed ref
const computedValue = computeRef(myRef, (value) => value * 2)
console.log(computedValue.value) // Outputs 10
// Later, when myRef changes, computedValue will automatically update
myRef.value = 7
console.log(computedValue.value) // Outputs 14source: The source ref object that the computed ref depends on. Changes to the source ref will trigger the computation.compute: A function that calculates the computed value based on the current value of the source ref. This function should not have side effects and should only depend on reactive data.
- The
computeReffunction returns a computed ref object that holds the computed value. You can access the computed value using the.valueproperty of the computed ref or by invoking it directly.
import { computeRef, ref } from 'regor'
const myRef = ref(5)
// Create a computed ref
const computedValue = computeRef(myRef, (value) => value * 2)
console.log(computedValue.value) // Outputs 10
// Later, when myRef changes, computedValue will automatically update
myRef.value = 7
console.log(computedValue.value) // Outputs 14