`我期待排序测验问题和答案，我从JSON文件中获取.在vue模板.我尝试了v-for指令，但我不能使用模板中的对象键.为了使它更清楚，我将演示我做了什么，到目前为止在脚本部分.期待有类似的东西：第一个问题

• a /第一个答案
• B /发送答复....

这是vue文件

<template>
  <div class="lg:pl-64 flex flex-col">

    <div v-for="data in datas">
      <h1>{{ data.question }}</h1>
    </div>
    <div>
      // looking to add multiple choice answers in here
    </div>

  </div>
</template>
<script setup>
import myData from "../data/data.json"
const datas = myData
const answers = []

datas.forEach((element) => {
  // pushing all the answers from JSON file to the answers array
  answers.push(element.answers)
})

// looping throught the arrays of objects to bring the key and value
answers.forEach((answer) => {
  for (let i = 0; i < answer.length; i++) {
    for (const key in answer[i]) {
      console.log(`${key}: ${answer[i][key]}`)
    }
  }
})
</script>

这是data.JSON文件

[
  {
    "id": 1,
    "question": "first Question",
    "answers": [{
        "a" : "first answer1",
        "b" : "second answer1",
        "c" : "third answer1",
        "z" : "fourth answer1"
    }],
    "correct": "a"
  }
,
    {
      "id": 2,
      "question": "second Question",
      "answers": [{
          "a" : "first answer2",
          "b" : "second answer2",
          "c" : "third answer2",
          "z" : "fourth answer2"
      }],
      "correct": "a"
    }
]