Discover published sets by community

Invoked immediately after the instance has been initialized, before data observation and event/watcher setup. Typically used to apply plugins.

Invoked when data changes and the DOM must be re-rendered, before the update patch is applied. Use case: Executing code before the DOM is updated.

Invoked immediately before a Vue instance is destroyed, providing an opportunity to perform cleanup or teardown operations. Use case: Removing event listeners or cancelling subscriptions.

Called when a reactive dependency is tracked during rendering. The hook receives a debugger event. Use case: Debugging and performance optimization, by getting insights into rendering dependencies.

Functional components in Vue are stateless, instance-less components that don't have access to lifecycle hooks. They are used for rendering purposes and introduced for performance optimizations.

Called once the component has been mounted, allowing direct access to the component via the DOM. Common use case: Accessing the DOM or setting up any JavaScript DOM manipulations.

A hook for capturing errors from descendants. It takes three arguments: the error, the component instance, and a string specifying information about where the error was captured. Typical use: Error handling across the component hierarchy.

Called after the instance is created, when instance has finished processing the options which means data observation, computed properties, methods, watch/event callbacks have been set up. Use case: Fetching data for the component.

Specific to keep-alive components, triggered when a cached component is reactivated. Use case: Useful if the component needs to refresh data or respond to the reactivation.

Called once a component is fully unmounted from the DOM. Use for final cleanup or informing any instance that depended on the now-unmounted component.

Runs right before the initial rendering is performed, after the template is compiled into a render function. Use case: Applying dynamic changes to the DOM before it's drawn.

Called after a data change causes the virtual DOM to be re-rendered and patched to the DOM. Use case: Executing code after the component’s DOM has been updated.

Invoked when a new re-render is triggered because a reactive dependency has changed. Typical use: Debugging and performance tuning to see which dependency caused a re-render.

Invoked before unmounting begins: the instance has not yet been fully unmounted. Use this hook for cleanup or to inform children components that the parent is being unmounted.

Used in server-side rendering for fetching data and rendering it on the server before sending the payload to the client. Use case: Reducing time-to-contentful-view by preloading data on the server.

Used with keep-alive components, fired when a cached component is deactivated. Use case: Cleanup activities when the component is being toggled away from.