Skip to content

Reactivator API: ref()

Appurist (Paul) edited this page Sep 17, 2020 · 3 revisions

ref()

Parameters: (data)

Returns: reference to reactive data object

This method wraps a simple scalar data element (such as a number or string, something other than an object or array) with an object that provides reactivity to that element. It is similar to the ref() function in the Vue 3 Composition API.

IMPORTANT: As the name would imply, the returned value is a reference to the data, not the data itself. All data access is performed though the .value member of the reference returned.

Example usage:

import { ref, watch } from 'reactivator'

let count = ref(42)

console.log("Starting count is", count.value)
watch(count, (old, val) => {
  console.log(`count has changed from ${old} to ${val}`)
})
count.value++;
count.value++;

Resulting output:

Starting count is 42
count has changed from 42 to 43
count has changed from 43 to 44