Signals & computed
Interactive counter with a lazy computed signal and precise text binding.
01 / Live preview● Interactive
Interact with the component. The source on the right is the actual code.
counter.tsx
● Zidom
import { signal, computed } from '@zidomjs/core';export default function CounterDemo() { const count = signal(0); const doubled = computed(() => count.value * 2); return ( <div className="example-card"> <p>Click to update a single bound text node.</p> <div className="demo-number">{count}</div> <p> Computed double: <strong>{doubled}</strong> </p> <div className="demo-actions"> <button onClick={() => count.value--}>−</button> <button onClick={() => (count.value = 0)}>Reset</button> <button onClick={() => count.value++}>+</button> </div> </div> );}This website demo runs pinned Zidom beta.1 packages; the latest framework release is beta.2. See release details and limitations. Report a problem with this example.