Vue.js来自对象键和嵌套数组的v-for循环

我在另一个v-for中安静了一个复杂的v-for循环.基本上显示问题列表和该问题的答案列表.我计划获取问题的密钥,并将其用于groups_answers的密钥.

v-for循环如下:

        

          {{question.question}}
          

            {{a.answer}}
          
        

目前返回错误:

无法读取undefined的属性'答案'.

grouped_answers对象示例如下:

[
  {
    "question_id": 1,
    "answers": [
      {
        "id": 1,
        "answer": "Cat"
      },
      {
        "id": 2,
        "answer": "Dog"
      }
    ]
  },
  {
    "question_id": 2,
    "answers": [
      {
        "id": 3,
        "answer": "Fish"
      },
      {
        "id": 4,
        "answer": "Ant"
      }
    ]
  }
]

对于完整模板,我附上了以下代码:

推荐后更新

        

          {{question.question}}
          

            {{a.answer}}
          
        

Eric G.. 8

v-for优先于v-if它,所以它试图在有任何数据之前运行循环.为了防止这种情况,添加一个周围的div或span并附加v-if加到那个.就像是:

    

      {{question.question}}
      

        

          {{a.answer}}
        
      
    

以下是他们提到优先级的文档:

https://vuejs.org/v2/guide/list.html#v-for-with-v-if

v-for优先于v-if它,所以它试图在有任何数据之前运行循环.为了防止这种情况,添加一个周围的div或span并附加v-if加到那个.就像是:

    

      {{question.question}}
      

        

          {{a.answer}}
        
      
    

以下是他们提到优先级的文档:

https://vuejs.org/v2/guide/list.html#v-for-with-v-if