new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Vue · all subjects

reactivity fundamentals

6 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

data() function must return an object

With the Options API, the data option should be a function that returns an object. Vue calls this function when creating a new component instance and wraps the returned object in its reactivity system. All top-level properties of this object are proxied on the component instance.

Reactive Proxy vs Original in Vue 3

In Vue 3, when you access a reactive property after assigning it, the value is a reactive proxy of the original object. Unlike Vue 2, the original object is left intact and will not be made reactive. You must always access reactive state as a property of this to maintain the reactivity connection.

Avoid $ and _ prefixes for data properties

Vue uses a $ prefix when exposing its own built-in APIs via the component instance and reserves the prefix _ for internal properties. You should avoid using names for top-level data properties that start with either of these characters.

DOM updates are buffered until next tick

When you mutate reactive state, the DOM is not updated synchronously. Instead, Vue buffers updates until the next tick in the update cycle to ensure each component updates only once regardless of how many state changes occurred.

nextTick() waits for DOM updates to complete

The nextTick() global API returns a Promise that resolves after Vue has applied pending DOM updates. Use it when you need to wait for the DOM to be updated after a state change.

Options API state is deeply reactive by default

In Vue, state is deeply reactive by default. Changes are detected even when you mutate nested objects or arrays without any special syntax.

Give your agent this brain