Meituan-Dianping/mpvue · warning

同一组件内嵌套的 v-for 不能连续使用相同的索引,目前为: ${arr}

Error message

同一组件内嵌套的 v-for 不能连续使用相同的索引,目前为: ${arr}

What it means

uni-app's mini-program compiler (mark-component) checks nested v-for inside the same component. If two or more nested v-for directives use the same iterator variable name (e.g., both `item in a` with `index` as iterator1), the compiled scoping would collide, so the compiler emits this custom Chinese warning.

Source

Thrown at src/platforms/mp/compiler/mark-component.js:20

function maybeTag (tagName) {
  return convertTagMap[tagName]
}

function getWxEleId (index, arr) {
  if (!arr || !arr.length) {
    return `'${index}'`
  }

  const str = arr.join(`+'-'+`)
  return `'${index}_'+${str}`
}

// 检查不允许在 v-for 的时候出现2个及其以上相同 iterator1
function checkRepeatIterator (arr, options) {
  const len = arr.length
  if (len > 1 && len !== new Set(arr).size) {
    options.warn(`同一组件内嵌套的 v-for 不能连续使用相同的索引,目前为: ${arr}`, false)
  }
}

function fixDefaultIterator (path) {
  const { for: forText, iterator1 } = path
  if (forText && !iterator1) {
    path.iterator1 = 'index'
  }
}

function addAttr (path, key, value, inVdom) {
  path[key] = value
  path.plain = false
  // path.attrsMap[key] = value
  if (!inVdom) {
    path.attrsMap[`data-${key}`] = `{{${value}}}`
  }

View on GitHub (pinned to 6c5d78ee04)

Solutions

  1. Rename the inner v-for index to a unique name (e.g. `j` or `innerIndex`)
  2. Also make item variable names unique between nested loops to avoid shadowing
  3. If lists are deeply nested, consider flattening data or splitting into child components

Example fix

// before
<view v-for="(row, i) in rows">
  <view v-for="(col, i) in row.cols">{{ col }}</view>
</view>
// after
<view v-for="(row, i) in rows">
  <view v-for="(col, j) in row.cols">{{ col }}</view>
</view>
Defensive patterns

Strategy: validation

Validate before calling

function assertUniqueIterators (vForStack) {
  const seen = new Set()
  vForStack.forEach(f => {
    if (seen.has(f.iterator1)) throw new Error('duplicate v-for index: ' + f.iterator1)
    seen.add(f.iterator1)
  })
}

Prevention

When it happens

Trigger: Nested `<view v-for="(a, i) in list1"><view v-for="(b, i) in list2">` — the inner v-for reuses the same index variable `i` as the outer one within one component.

Common situations: Copy-pasted nested list templates; nested tables/grids iterating rows and columns with the same index name; converting web Vue templates that tolerated shadowing into mp templates where the compiler forbids it.

Related errors


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