Meituan-Dianping/mpvue · error

v-${el.elseif ? ('else-if="' + el.elseif + '"') : 'else'} us

Error message

v-${el.elseif ? ('else-if="' + el.elseif + '"') : 'else'} used on element <${el.tag}> without corresponding v-if.

What it means

v-else or v-else-if was used on an element whose previous sibling does not carry v-if (or is absent entirely). Without an adjacent v-if, the conditional directive has nothing to attach to, so the compiler warns and the element is treated as unconditional.

Source

Thrown at packages/weex-template-compiler/build.js:1694

    if (getAndRemoveAttr(el, 'v-else') != null) {
      el.else = true;
    }
    var elseif = getAndRemoveAttr(el, 'v-else-if');
    if (elseif) {
      el.elseif = elseif;
    }
  }
}

function processIfConditions (el, parent) {
  var prev = findPrevElement(parent.children);
  if (prev && prev.if) {
    addIfCondition(prev, {
      exp: el.elseif,
      block: el
    });
  } else if (process.env.NODE_ENV !== 'production') {
    warn(
      "v-" + (el.elseif ? ('else-if="' + el.elseif + '"') : 'else') + " " +
      "used on element <" + (el.tag) + "> without corresponding v-if."
    );
  }
}

function findPrevElement (children) {
  var i = children.length;
  while (i--) {
    if (children[i].type === 1) {
      return children[i]
    } else {
      if (process.env.NODE_ENV !== 'production' && children[i].text !== ' ') {
        warn(
          "text \"" + (children[i].text.trim()) + "\" between v-if and v-else(-if) " +
          "will be ignored."
        );
      }

View on GitHub (pinned to 6c5d78ee04)

Solutions

1. Ensure the v-else/v-else-if element is the immediately following sibling of an element with v-if
2. Remove any elements between the v-if and v-else elements
3. Move v-else off elements that already have v-if

Example fix

// before
<div v-if="ok">A</div>
<span>other</span>
<div v-else>B</div>
// after
<div v-if="ok">A</div>
<div v-else>B</div>

function checkElseAdjacency(template) {
  // element with v-else must be immediately preceded by an element with v-if/v-else-if
  const re = /<(?!template)([\w-]+)([^>]*)>/g;
  let m, prev = null;
  while ((m = re.exec(template))) {
    const attrs = m[2];
    if (/\sv-else(-if)?[=\s>]/.test(attrs) && !(prev && /\sv-(if|else-if)[=\s]/.test(prev))) {
      return `v-else on <${m[1]}> without preceding v-if`;
    }
    prev = attrs;
  }
  return null;
}

When it happens

Trigger: Writing v-else / v-else-if on an element where processIfConditions finds either no previous sibling (prev is falsy) or prev has no .if property — e.g. an intervening element, a text/comment node breaking adjacency, or v-if on a non-sibling.

Common situations: Placing a whitespace-producing element or another tag between the v-if element and the v-else, putting v-else on the same element as v-if, or reordering elements so the v-if block no longer immediately precedes the else block.

Related errors

• text "${children[i].text.trim()}" between v-if and v-else(-i
• tag <${tag}> has no matching end tag.
• Templates should only be responsible for mapping the state t
• <template> cannot be keyed. Place the key on real elements i
• Invalid v-for expression: ${exp}

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