Quasar V2中v-for仅渲染API返回数组首个元素的问题求助

问题根源 #

你在v-for的参数理解和使用上出现了错误：在v-for="(memorial, key, index) in memorials"的写法中，第一个参数memorial已经是memorials数组中的单个元素，但你错误地通过memorial[index]去访问属性，这直接导致循环逻辑异常，最终仅能显示首个元素。

修正后的代码 #

Template部分（核心修正）

<q-list>
  <q-item
    v-for="(memorial, index) in memorials"
    :key="memorial.id"
  >
    <q-item-section>
      <q-item-label>{{ index }} - {{ memorial.name }}</q-item-label>
      <q-item-label caption>{{ memorial.conflict.name }}</q-item-label>
    </q-item-section>

    <q-item-section side top>
      <q-badge color="teal" :label="memorial.noOfPersonnel" />
    </q-item-section>
  </q-item>
</q-list>

关键修正点 #

• 调整v-for参数为(memorial, index) in memorials：memorial直接对应数组中的每一条数据，index为当前项的索引（如果不需要索引可以省略）
• :key绑定memorial.id：遵循Vue推荐的用唯一标识作为key的规范
• 所有属性直接通过memorial.xxx访问：无需再通过memorial[index]这种错误方式

额外确认 #

你的script部分数据赋值逻辑没有问题，只要response.data是标准数组（从你提供的控制台日志来看确实是数组结构），修正template后就能正常渲染所有条目。

内容的提问来源于stack exchange，提问作者Scanmaster