vue 中map的用法

在 Vue 中，map 方法可以用于遍历数组并返回一个新数组。使用 map 方法，你可以将数组中的每个元素都执行一个函数，并返回一个新的数组，数组的元素是执行函数后返回的结果。以下是 map 方法的基本语法：

array.map(function(currentValue, index, arr), thisValue)

参数说明：

- `function(currentValue, index, arr)`：必选参数。函数，数组中的每个元素都会执行这个函数。函数可以有三个参数：
- `currentValue`：必选参数。当前元素的值
- `index`：可选参数。当前元素的索引
- `arr`：可选参数。当前元素所属的数组对象
- `thisValue`：可选参数。对象，当执行回调函数时，用作 `this` 的值。

以下是一个简单的例子：

var arr = [1, 2, 3, 4, 5];
var newArr = arr.map(function(item) {
  return item * 2;
});
console.log(newArr); // [2, 4, 6, 8, 10]

在 Vue 中，map 方法可以用于 v-for 指令中，用于遍历数组并渲染模板。例如：

<ul>
  <li v-for="(item, index) in items.map(item => item * 2)" :key="index">{{ item }}</li>
</ul>

上面的代码中，我们使用 map 方法将 `items` 数组中的每个元素都乘以 2，生成一个新的数组，然后使用 v-for 指令遍历这个新数组并渲染模板。注意，我们在 v-for 指令中使用了 `:key` 属性来提高性能。