我一直在寻找一个关于此的简单示例的时间，因此我来到 SO 社区寻求帮助。
如果我有一个带有这样数组的 json 对象（外部，假设我们已将其作为“信息”访问）...
{
"Job": {
"JobId": "123",
"Tasks": [
{
"TaskId": "1",
"TaskName": "Test Task 1",
"SubTasks": [
{
"SubTaskId": "1",
"SubTaskName": "Test Sub Task 1"
},
{
"SubTaskId": "2",
"SubTaskName": "Test Sub Task 2"
},
{
"SubTaskId": "3",
"SubTaskName": "Test Sub Task 3"
}
]
},
{
如何在 Vue 实例中访问它并访问嵌套数组？我能找到的每一个例子要么是悲惨地在我头上，要么看起来像下面这样：
new Vue({
el: "ID1",
data: {
items: [
{ message: 'Foo' },
{ message: 'Bar' }
]
}
})
但是我已经知道如何使用 v-for 从实例中已经存在的数组中获取数据（我的意思是硬编码），尽管嵌套数组仍然让我有点逃避，但我终生无法弄清楚如果数组和嵌套数组位于带数组的 json 对象中，这是一种直接访问数组和嵌套数组的方法。
我已经尝试将“数据”放入实例中，如下所示来获取对象：
new Vue({
el: "ID1",
data: Info
})
或者
new Vue({
el: "ID1",
data: {
items: Info,
/// extra stuff here
}
})
只要我可以访问对象（信息），它就可以工作，但是当我尝试使用诸如 v-for="Task in Tasks" 之类的东西时遇到错误（例如）“未定义属性或方法“任务”在实例上，但在渲染期间被引用。通过初始化属性，确保此属性是反应性的，无论是在数据选项中，还是对于基于类的组件”。
我希望能够做到：
<div id="ID1">
<ul>
<li v-for="Task in Tasks">{{ Task.TaskId }}</li>
</ul>
</div>
或进一步：
<div id="ID1">
<ul>
<li v-for="SubTask in SubTasks">{{ SubTask.SubTaskId }}</li>
</ul>
</div>
我知道那些不起作用，只是想举个例子。
对此的任何帮助将不胜感激。随时带我去 Vue 101。我不知道还有什么要问或提供什么才能使它成为一个更好的问题。我通常不会问这么宽泛的问题，我通常会花时间实际学习如何做到这一点，但我被困住了，试图为明天完成一些事情，并且在这一点上非常沮丧。我在 JS 中使用了嵌套的 forEach 循环并用 JQuery 输出了很多次，但我无法在 Vue 中弄清楚这个逻辑。提前致谢。
相关分类