javascript - Vue 中的嵌套循环

Question

我有一个通过 vue 传递的对象的对象，我这样做是为了运行:

 <ul>
    <li v-for="subjects in questions">
        <li v-for="question in subjects">
            @{{ question }}
        </li>
    </li>
</ul>

但是我收到这个错误:

属性或方法“subjects”未在实例上定义，但在渲染期间被引用。确保在数据选项中声明响应式数据属性。(在根实例中找到)

如何在 vue 中运行嵌套循环？

Answer 1

举个例子:

var vm = new Vue({
  el: '#app',
  data: {
    questions: [
      {
        subjects: ['question 1.1', 'question 1.2']
      },
      {
        subjects: ['question 2.1', 'question 2.2']
      }
    ]
  }
})

<script src="https://cdn.jsdelivr.net/vue/2.0.3/vue.js"></script>

<div id="app">
  <ul>
    <li v-for="question in questions">
      <ul>
        <li v-for="subject in question.subjects">
          {{ subject }}
        </li>
      </ul>
    </li>
  </ul>
</div>