uniapp遍历数组对象的常见方法

在 UniApp 中，遍历数组对象的方法与在普通 JavaScript 中是相同的。UniApp 是一个使用 Vue.js 开发所有前端应用的框架，因此你可以使用 Vue.js 和 JavaScript 的语法来遍历数组对象。

以下是一些常见的遍历数组对象的方法：

使用 for 循环

let arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  // ...
];

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i].id, arr[i].name);
}

使用 for...of 循环 (ES6+ 语法)

let arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  // ...
];

for (let item of arr) {
  console.log(item.id, item.name);
}

使用 Array.prototype.forEach 方法

let arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  // ...
];

arr.forEach(item => {
  console.log(item.id, item.name);
});

使用 Array.prototype.map 方法 (虽然 map 通常用于生成新数组，但也可以用于遍历)

let arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  // ...
];

arr.map(item => {
  console.log(item.id, item.name);
  // 注意：map 会返回一个新数组，但在这里我们只是用它来遍历
  return null; // 可以返回任何值，但在这个例子中我们不需要新数组
});

使用 Vue 的 v-for 指令 (在 UniApp 的模板中)

如果你在 UniApp 的模板中需要遍历数组对象，可以使用 v-for 指令：

<template>
  <view>
    <text v-for="(item, index) in arr" :key="index">{{ item.id }} - {{ item.name }}</text>
  </view>
</template>

<script>
export default {
  data() {
    return {
      arr: [
        { id: 1, name: 'Alice' },
        { id: 2, name: 'Bob' },
        // ...
      ]
    }
  }
}
</script>