javascript - 为什么我的嵌套 For 循环在使用 Vue 时只返回第二个数组的第一个值?

标签 javascript json vue.js

我正在使用嵌套的 For 循环来访问 json 中的数据,然后返回一个变量以在前端使用 Vue 进行访问。我不确定为什么,但我只返回嵌套数组第一个元素的值?希望有人可以帮助解决这个问题。这似乎没有意义。

***总是只有 1 个作业,这就是为什么我只循环遍历作业 [0]。

我试过 forEach,For of,For,我试过 map(不确定如何正确实现)。

所以,这有效,我可以使用 Vue 返回 key 。请注意,这是一个示例,正在正确访问 json 并且需要将“数据”传递给函数。

function getData(Data) {
    var jobs = Jobs;
    var i;
    for (i = 0; i < jobs.length; i++) {
        return items;
    }
}

try {
    Data.values = getData(Data);
}
catch (e) {
    logError(e);
}

这是 Vue:

<div v-for="value in values">{{ value.Key }}</div>

这不起作用,我不确定为什么?

function getData(Data) {
    var jobs = Jobs;
    var i;
    for (i = 0; i < jobs.length; i++) {
        var items = jobs[0].Items;
        for (i = 0; i < items.length; i++) {
            return items[i].Values;
        }
    }
}

try {
    Data.values = getData(Data);
}
catch (e) {
    logError(e);
}

这是 Vue:

<div v-for="value in values">{{ value.Key }}</div>

如您所见,我刚刚深入数组。但是,我在前端返回的只是第一项的 key 。例如,我可以使用 return items[2].Values 指定我想要访问的项目,所以我知道我可以访问它们,但我无法获取所有值。 json 格式正确,我已经像这样在没有 Vue 的情况下使用 For 循环一百万次(我是 Vue 的新手)来访问数据。请在给我一个方法、组件或 Vue 特定的东西之前,请理解我必须在单独的 js 文件中使用这样的函数来返回我将在前端访问的值。这是一个奇怪的设置,但它就是这样。总的来说我有点迷茫但是如果我能解决这个问题它会走很长一段路因为现在我会使用第一个例子然后做这样的事情(再次只是一个例子):

<template v-for="item in items">
<div v-for="value in values">{{ thing.Key }}</div>
</template>

这对于简单的东西来说很好,但是随着我深入了解 json,我遇到了一些问题。我正在访问的一些值是 5 和 6 级深,并且有 if 语句,我需要对一些值进行数学运算以运行字符串并计算其他项目,并且有些项目是对象,而其他项目在json 的同一级别是数组。这是一团糟,能够在 for 语句中将其整理出来真的很有帮助。

非常感谢所有帮助。

最佳答案

您在两个循环中都声明了 i。如果您只是循环遍历作业的单个数组项,则无需循环作业并直接跳转到其项。

您还将返回一个值,因此循环不会通过第一次迭代。

function getBarCodes(Jobs) {
    var arr = [];
    var items = Jobs[0].Items;
    for (var i = 0; i < items.length; i++) {
        arr.push(items[i].Values)
    }
    return arr;
}

相反,您可以遍历项目,通过将这些项目推送到集合数组来收集每个项目的值,然后返回数组。

关于javascript - 为什么我的嵌套 For 循环在使用 Vue 时只返回第二个数组的第一个值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57138066/

相关文章:

javascript - 当字符串包含 src =""或 id =""属性时,不能 $.parseJSON()

javascript - 单击按钮时将字体大小增加或减少 1em

javascript - 对象数组在其上运行过滤器后返回未定义

Python 和 Pandas : UnicodeDecodeError: 'ascii' codec can't decode byte

javascript - JSON.stringify() 数组与 Prototype.js 的奇怪之处

vue.js - 用于 VueJS vue-router 的 Bootstrap nav pills

angular - 相当于 Vue 2 中 Angular 2 的服务

javascript - 使用 JS 加载 iFrame 时制作链接变量

php - jQuery ajax POST 数据变量最多可容纳 199 个 json 数组

javascript - 如何将所有 Vue.js 路由、模板和组件合并到一个文件中?