[Vue warn]: Maximum recursive updates exceeded Vue Origin: On your device OSI layer 7 · Application Last updated 5 Nov 2026

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

A watcher/computed/render effect keeps changing the state it depends on, creating an infinite update loop.

Exact message you may see [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 itselfMaximum recursive updates exceeded[Vue warn]: You may have an infinite update loop in a component render functionYou may have an infinite update loop in watcher with expression
Seen on: Vue

Meaning

Look for state mutations in computed (should be pure), in templates/render functions, or watch callbacks that set the watched value. Use watch with conditions, avoid writing to refs read in the same effect, and use watchEffect carefully. Debug with onRenderTriggered.

Common causes

  • Mutating state inside computed/render
  • Watcher writes the value it watches
  • v-model updating itself with transformed value
  • Two watchers triggering each other
  • Array/objects replaced every render

⚡ Quick fix

  1. Make computed pure; move mutations to handlers
  2. Add guards: if (a.value !== next) a.value = next
  3. Break watcher cycles; use flush: "post" / { deep: false } as needed

Detailed fix by platform

Vue

  1. watch(source, (v) => { if (target.value !== f(v)) target.value = f(v); });

How to diagnose

  1. Effect — Which?
  2. Mutation — Own dependency?
  3. Guard — Present?

🔧 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]: Avoid adding reactive properties to a Vue instance or its root $data at runtime — Vue 2: [Vue warn]: Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option (Vue)[Vue warn]: Avoid add…[Vue warn]: Set operation on key failed: target is readonly — Vue: [Vue warn]: Set operation on key "name" failed: target is readonly. (Vue)[Vue warn]: Set opera…[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…[Vue warn]: Unhandled error during execution of setup/mounted hook — Vue: [Vue warn]: Unhandled error during execution of mounted hook / TypeError: Cannot read properties of undefined (reading 'x') (Vue)[Vue warn]: Unhandled…[Vue warn]: Write operation failed: computed value is readonly — Vue: [Vue warn]: Write operation failed: computed value is readonly (Vue)[Vue warn]: Write ope…Avoid mutating a prop directly — Vue: [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders (Vue)Avoid mutating a prop…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…Vue received a Component that was made a reactive object — Vue: [Vue warn]: Vue received a Component that was made a reactive object — mark it with `markRaw` or use `shallowRef` (Vue)Vue received a Compon…[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.