如何在Vue.js中竖向显示JS数组数据？

js 处理数组数据竖向显示

在 vue.js 中处理数组数据以实现竖向显示，需要对数组进行预处理。以下示例展示了如何处理数组 arr 并将其竖向显示：

let arr = [
  [{ price: 26, item_name: '测试1' }, { price: 269, item_name: '测试1' }, { price: 546, item_name: '测试1' }],
  [{ price: 75, item_name: '测试2' }, { price: 360, item_name: '测试2' }, { price: 648, item_name: '测试2' }, { price: 914, item_name: '测试2' }],
  [{ price: 142, item_name: '测试3' }, { price: 456, item_name: '测试3' }, { price: 685, item_name: '测试3' }]
];

// 处理数组
arr = arr.flat();

处理完成后，可以在 vue.js 中双重循环显示数据，如下：

<template>
  <div>
    <div v-for="i in arr" :key="i">
      <div>{{ i.item_name }}</div>
    </div>
  </div>
</template>

此时，数组中的数据将竖向显示。

以上就是如何在Vue.js中竖向显示JS数组数据？的详细内容，更多请关注硕下网其它相关文章！