Vue 3中对象的Cant循环槽阵列

<template>
  <div
    class="shadow-xl w-96 h-96 md:h-[600px] md:w-[600px] lg:my-12 lg:w-[700px] lg:h-[700px] rounded-md"
  >
    <button @click="getData">Get data</button>
    <ul v-for="question in questions" :key="question.answer">
      <li>{{ question.answer }}</li>
    </ul>
  </div>
</template>

数据是这样的

questions: [
        { "answer": "Paris", "correct": true },
        { "answer": "Tokio", "correct": false },
        { "correct": false, "answer": "Dubai" },
        { "answer": "London", "correct": false }
      ]

它们在数据库中，我正确地获取它们;如果我使用

<ul v-for="question in questions" :key="question.answers">
      <li>{{ question.answers }}</li>

我得到一个对象的数组，看起来像这样：

[ { "answer": "Paris", "correct": true }, { "answer": "Tokio", "correct": false }, { "answer": "Dubai", "correct": false }, { "answer": "London", "correct": false } ]

但是如果我只想显示城市名称，那么我将代码改为：

<ul v-for="question in questions" :key="question.answers">
      <li>{{ question.answer }}</li>

甚至

<ul v-for="question in questions" :key="question.answers">
      <li>{{ question.answers.answer }}</li>

但是它不起作用，我在哪里犯了错误？我有两个问题作为文件在消防局。我想也许我应该给你v-v两次。。

<ul v-for="question in questions" :key="question.answers">
      <li>{{ question.answer }}</li>

甚至

<ul v-for="question in questions" :key="question.answers">
      <li>{{ question.answers.answer }}</li>