Lesson 20 — Composables

Reusable logic: composables

A composable is a function (named useSomething) that creates refs and functions and returns them. Each call makes a fresh, independent set, so two counters do not share a count. It is Vue's version of React's custom hooks.

function useToggle(start = false) {
  const on = ref(start)
  return { on, toggle: () => (on.value = !on.value) }
}

Why it matters: fetching, forms and timers get written once and reused across components.