Meituan-Dianping/mpvue · error

`key` does not work on <slot> because slots are abstract out

Error message

`key` does not work on <slot> because slots are abstract outlets and can possibly expand into multiple elements. Use the key on a wrapping element instead.

What it means

Dev-only warning in processSlot: a key was set on a <slot> element. Slots are abstract outlets that may expand into multiple nodes, so a single key is meaningless for the diff algorithm; the key attribute is ignored and the warning directs you to a real wrapper element.

Source

Thrown at src/compiler/parser/index.js:424

function addIfCondition (el, condition) {
  if (!el.ifConditions) {
    el.ifConditions = []
  }
  el.ifConditions.push(condition)
}

function processOnce (el) {
  const once = getAndRemoveAttr(el, 'v-once')
  if (once != null) {
    el.once = true
  }
}

function processSlot (el) {
  if (el.tag === 'slot') {
    el.slotName = getBindingAttr(el, 'name')
    if (process.env.NODE_ENV !== 'production' && el.key) {
      warn(
        `\`key\` does not work on <slot> because slots are abstract outlets ` +
        `and can possibly expand into multiple elements. ` +
        `Use the key on a wrapping element instead.`
      )
    }
  } else {
    const slotTarget = getBindingAttr(el, 'slot')
    if (slotTarget) {
      el.slotTarget = slotTarget === '""' ? '"default"' : slotTarget
    }
    if (el.tag === 'template') {
      el.slotScope = getAndRemoveAttr(el, 'scope')
    }
  }
}

function processComponent (el) {
  let binding

View on GitHub (pinned to 6c5d78ee04)

Solutions

1. Remove the :key from <slot>
2. Wrap the slot in a keyed real element if you need to key the region

When it happens

Trigger: Thrown at src/compiler/parser/index.js:424 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of Meituan-Dianping/mpvue@6c5d78ee04 (2026-09-02). Data as JSON: /api/errors/b458d95f5bdbc348. Report an issue: GitHub.