Question

我想知道人们如何使用v-for这样简单的数组。我认为这些是我的选择。第一种选择意味着没有简单数组的位置。

改为使用对象数组，为每个项目显式声明一个键。请勿在v-for中使用键。

如何显示数组中的一个元素？

 `<template>:`

    <ul>
        <li v-for="fruit in fruits" :key="fruit"></li>
    </ul>

<script>:

export default {
        data() {
            return {
                fruits: ['apple', 'banana', 'orange']
            };
        }
    };

Answer 1

首先，不要在脚本中放置;符号。只需使用逗号,即可分隔数据，方法，计算所得等。

如果您不打算使用它，则不必指定密钥。
要在循环中显示元素，只需将其放在双花括号{{ }}中。
如果需要索引，可以在项目后指定它。要显示它，您做同样的事情，只需将其放在双花括号中：{{index}}

Codepen： https://codepen.io/x84733/pen/dKwjBL?editors=1010

<ul>
  <li v-for="(fruit, index) in fruits">
    {{index}}: {{fruit}}
  </li>
</ul>

...

data () {
  return {
    fruits: ['apple', 'banana', 'orange'] 
  }
},
methods: {
  ...
}

简单数组的V-for：使用什么键？

1 个答案: