Vue.js 在vue js v-for中循环遍历数组中的对象

我想通过vue js中的v-for循环查看咖啡类型和价格

[{"Americano":"32$"},{"Espresso":"40$"},{"Cappuccino":"20$"},{"Americano":"32$"},{"Espresso":"40$"},{"Cappuccino":"20$"}]

---

查看是否可以按以下所述更改数据结构：

<template>
  <div>
    <div v-for="(item, index) in items" :key="index">
      <div>Item: {{ item.title }}</div>
      <div>Price: {{ item.price }}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'YouComp',
  data() {
    return {
      items: [
        { title: 'Americano', price: '32$' },
        { title: 'Espresso', price: '40$' },
        { title: 'Cappuccino', price: '20$' },
      ],
    };
  },
};
</script>