Reactive State

QuantaJS provides a powerful reactivity system via the reactive function, allowing you to create state that automatically updates dependent computations.

Creating Reactive State

Use the reactive function to make an object reactive:

import { reactive } from "quantajs";

const state = reactive({
  count: 0,
  name: "Quanta",
});

state.count++; // Updates are tracked automatically
console.log(state.count); // 1

Nested Reactivity

Nested objects are also reactive:

const state = reactive({
  user: { name: "Alice", age: 25 },
});

state.user.age = 26; // Nested property is reactive
console.log(state.user.age); // 26

Reactive State with Collections (Map/Set)

QuantaJS supports reactive Map and Set:

const map = reactive(new Map([["key", "value"]]));
map.set("newKey", "newValue");
console.log(map.get("newKey")); // "newValue"

const set = reactive(new Set([1, 2, 3]));
set.add(4);
console.log(set.size); // 4

Learn More