时间戳

首页 > 解决方案 > 无法在 Jquery 中保存获取的数据

javascript - 无法在 Jquery 中保存获取的数据

问题描述

我正在处理我的前端，我遇到了一个障碍。我正在尝试从后端获取数据，它实际上是在获取数据。但只有在其他一切之后？我会给你看。

$(function(){
    function GetURLId() {
        var url = window.location.href;
        var path = url.substring(url.lastIndexOf('/') + 1);
        var id = path.substring(path.lastIndexOf('?id=') + 4, path.lastIndexOf("?id") + 5)
        return id;
    }


    var url = 'https://localhost:5001/api/rental/byId/' + GetURLId();

        fetch(url)
        .then((resp) => resp.json()) 
        .then(function(data) {
            Object.keys(data).forEach(key => {
                console.log(`${key}: ${data[key]}`);
            })
        });
});

所以首先我从 URL 中得到我正在使用的 id。那么问题出在它下面的代码。我可以在控制台中获取我的数据。记录这个：

id: 2
status: "Open"
damage: true

所以数据实际上是从我的后端获取的。但是现在，每次我尝试保存数据时，它都未定义。我试过了：

$(function(){
    var rental = []; // Added an array
    var url = 'https://localhost:5001/api/rental/byId/' + GetURLId();

        fetch(url)
        .then((resp) => resp.json()) 
        .then(function(data) {
            Object.keys(data).forEach(key => {
                console.log(`${key}: ${data[key]}`);
                rental.push(rental[key] = data[key]);
            })
        });
    console.log(rental['id']); // Returns undefined
});

和：

var rental = []; // Added an array outside of the function
$(function(){
    var url = 'https://localhost:5001/api/rental/byId/' + GetURLId();

        fetch(url)
        .then((resp) => resp.json()) 
        .then(function(data) {
            Object.keys(data).forEach(key => {
                console.log(`${key}: ${data[key]}`);
                rental.push(rental[key] = data[key]);
            })
        });
    console.log(rental['id']); // Returns undefined
});

但！最后一个是在函数之外租用的，我实际上可以在控制台中调用它。在控制台中，它实际上确实返回了值。

Inside Console:
> rental["id"]
< 2

最后，我尝试检查 fetch 中键和值的值，如下所示：

$(function(){
    var url = 'https://localhost:5001/api/rental/byId/' + GetURLId();

        fetch(url)
        .then((resp) => resp.json()) 
        .then(function(data) {
            Object.keys(data).forEach(key => {
                if(key == "status" && data[key] != "Reserved") {
                    console.log(`${key}: ${data[key]}`); // Returns damage: undefined 3 times
                }
            })
        });
});

但这也行不通。它在控制台中返回伤害：未定义 3 次。

因此，如果有人知道这里发生了什么，那就太棒了！

提前非常感谢。

标签： javascriptjqueryfetch

解决方案

答案：我的代码中有 2 个错误。- 首先，我没有正确考虑代码的异步性质。- 其次，当试图用另一个修复它时，然后阻止并在那里执行我的代码。我没有在进程 then 块中返回值，而是返回了 forEach。

fetch(url)
        .then(resp => resp.json()) 
        .then(data => {
            var rentalStatus;
            Object.keys(data).forEach(key => {
                rental[key] = data[key];
                if(key == "status") {
                    rentalStatus = data[key];
                }
            })
            return rentalStatus;
        })
        .then(rentalStatus => {
            console.log(rental["id"]); // This does return the id now!
            if(rentalStatus == "Reserved") {
                $("#assign-items").removeClass("d-none");
            }
        }).catch(error => {
            console.log("Error:" + error);
        });

推荐阅读