Written from your composables, directives and plugins note. The matching study page is Reusability — composables, directives, plugins.
toValue() with refs, getters and plain values, and why lifecycle hooks in composables only work during setup.<script setup>, when a directive is the right tool, the function shorthand, the binding object, and why directives on components are discouraged.app.use() calls, what a plugin can configure, and an i18n plugin that provides a function and a template helper.This note is accurate. Two small things to tidy.
"Not recommended for use on custom components" is listed under composable best practices, but it is a rule about custom directives: on a component they apply to the root element only, and are ignored with a warning on multi-root components.
"Use only in script setup" is close. The rule is to call them synchronously during setup, in <script setup> or setup(), because their lifecycle hooks and watchers attach to the component whose setup is running.
usePagedList(page) from the questions and call it with a number, a ref and a getter.v-color globally and change the bound value to see the function shorthand handle updates.locale ref."It is a use-prefixed function that encapsulates stateful logic, is called synchronously during setup, and returns a plain object of refs so callers can destructure it. It accepts refs, getters or plain values and reads them with toValue() inside a watchEffect or computed, so it reacts when they change. It cleans up after itself, because its lifecycle hooks attach to the calling component. State created outside the function is shared by every caller, which on a server means every request, so in Nuxt that kind of state goes in useState."
"A directive only for low-level DOM work on an element, like focusing an input when it appears or wiring a DOM library, and not on components. A plugin when something has to be set up once for the whole app: global components or directives, app.provide for a service, an error handler, analytics. Libraries like Vue Router and i18n are plugins that expose composables through provide/inject."
Nothing yet. Notes filed here show up on this page and the section overview.
Vue components in depth
Questions and flashcards from your notes on the Vue docs' Components In-Depth chapter — compiler macros, prop naming and read-only props, local drafts of props, event arguments, several v-models, v-model modifiers, defineModel and its pre-3.4 equivalent, fallthrough attributes, slots and dynamic scoped slots, provide/inject per subtree and async components — with a fact check of the notes.
Built-in components
Questions and flashcards from your notes on Vue's built-in components — what triggers a Transition and its classes, the move class of TransitionGroup, how KeepAlive caches instances and DOM, its hooks, max and include, Teleport's logical versus DOM hierarchy and deferred targets, and what Suspense waits for, with errors and Nuxt pages — with a fact check of the notes.