Javascript Vue.JS中的数组和嵌套数组

在一个组件中，我有以下阵列：

export default {
  data() {

    return {

      userGrades: [
        [course= "Mathematics"], [grade = 18 ],
        [course= "Physics"], [grade = 15 ],
      ],


      userSubscriptions: [
        [option= "Swiming Pool"], [price = 60 ],
        [option= "Fiteness Club"], [price = 30 ],
      ],


      userContact: [(phone = "00000000"), (fax = "11111111")],



    }

我想使用neted v-for指令来列出它们。 对于单个阵列，它是直接向前的，

---

但是当我使用嵌套的v-for时，代码会编译，但是没有任何东西会被呈现。

Javascript没有嵌套关联数组的概念。必须使用对象表示法：

userGrades: [
  {
      course: 'Mathematics',
      grade: 18
  }
]

---

以下是您应该声明的数组

userGrades: [
{
    course: 'Mathematics',
    grade: 18
},
{
    course: 'Physics',
    grade: 15
}],
userSubscriptions: [
{
    option: "Swiming Pool",
    price: 60
},
{
    option: "Fiteness Club",
    price: 30
}],
userContact: [
{
    phone: "00000000"
},
{
    fax: "11111111"
}]

您可以按=>

<div v-for="item in userGrades">
{{item.course}}=>{{item.grade}}
</div>

{{item.course}=>{{{item.grade}

---

所有其他数组对象也是如此。

您可以添加模板吗，即列出代码？？？这些数组是什么，里面到底有什么？这不应该编译。它编译，但根本不是你所期望的；您定义的是

{userGrades:[[“数学”]、[18]、[Physics”]、[15]、userSubscriptions:[[“游泳池”]、[60]、“健身俱乐部”]、[30]、userContact:[“00000000”、“11111111”]}

，因为所有这些

foo=bar

块最终都返回

bar

。