[Vue warn]: Unhandled error during execution of setup/mounted hook Vue Origin: On your device OSI layer 7 · Application Last updated 5 Nov 2026

Vue: [Vue warn]: Unhandled error during execution of mounted hook / TypeError: Cannot read properties of undefined (reading 'x')

An exception was thrown inside a lifecycle hook, watcher, event handler or render, and Vue logs it with the context.

Exact message you may see [Vue warn]: Unhandled error during execution of mounted hook[Vue warn]: Unhandled error during execution of setup function[Vue warn]: Unhandled error during execution of native event handler[Vue warn]: Unhandled error during execution of render function[Vue warn]: Unhandled error during execution of watcher callback
Seen on: Vue

Meaning

The real cause is the error that follows (TypeError, network error). Read the stack, fix the undefined access (data not loaded, wrong ref), wrap async calls in try/catch, and add app.config.errorHandler / onErrorCaptured for reporting.

Common causes

  • undefined data accessed in setup/mounted
  • Async function errors unhandled
  • Ref accessed before mount
  • Wrong prop usage
  • Third-party lib errors

⚡ Quick fix

  1. Read the TypeError below the warning and fix that line
  2. try/catch around async work
  3. Set app.config.errorHandler to log centrally

Detailed fix by platform

Vue

  1. app.config.errorHandler = (err, instance, info) => { console.error(info, err); };

How to diagnose

  1. Hook — Which?
  2. Error — Below the warning?
  3. Handler — Configured?

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

Where this error sits

Origin: On your device. Errors that are often confused with or caused by this one (click to open):

[Vue warn]: Error in v-on handler / Error in mounted hook (Vue 2) — Vue 2: [Vue warn]: Error in v-on handler: "TypeError: Cannot read property 'x' of undefined" (Vue)[Vue warn]: Error in …[Vue warn]: Failed to locate Teleport target with selector — Vue: [Vue warn]: Failed to locate Teleport target with selector "#modal". Note the target element must exist before the component is mounted (Vue)[Vue warn]: Failed to…[Vue warn]: Maximum recursive updates exceeded — Vue: [Vue warn]: Maximum recursive updates exceeded in component <Foo>. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself (Vue)[Vue warn]: Maximum r…[Vue warn]: onMounted is called when there is no active component instance — Vue: [Vue warn]: onMounted is called when there is no active component instance to be associated with (Vue)[Vue warn]: onMounted…[Vue warn]: Slot "default" invoked outside of the render function — Vue: [Vue warn]: Slot "default" invoked outside of the render function: this will not track dependencies used in the slot (Vue)[Vue warn]: Slot "def…ESLint Parsing error in .vue files — ESLint: Parsing error: Unexpected token < / Parsing error: '>' expected (vue-eslint-parser not configured) (Vue)ESLint Parsing error …Property was accessed during render but is not defined — Vue: [Vue warn]: Property "x" was accessed during render but is not defined on instance (Vue)Property was accessed…this.$refs.x / ref.value is undefined or null before mount — Vue: TypeError: Cannot read properties of undefined (reading 'focus') — template ref accessed before the component is mounted (Vue)this.$refs.x / ref.va…[Vue warn…

Explore the map of this error Full error map →

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.

💬 What worked for others

No tips yet — did something else fix this for you?

Share what worked for you

Tips are checked by an editor before they appear. Links are removed.