时间戳

首页 > 解决方案 > ajax请求后变量不更新

javascript - ajax请求后变量不更新

问题描述

我有下面的代码，它位于 Vue 脚本中。

user_id = 100; //sample data

$.ajax({
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
    },
    type: "GET",
    url: '/user',
    success: function (user) {
        user_id = user.user_id;
        console.log(user_id); //returns 1
    },
    error: function (result) {
    }
});

console.log(user_id); //returns 100 not 1

我希望能够存储由 ajax 请求产生的值为 1。但是，当我在脚本末尾 console.log 时，它返回 100 而不是 1。我认为我需要使用 promise/callback解决这个问题，但我不确定我需要做什么/做什么。有人能帮我吗？

标签： javascriptajaxvue.jspromiserequest

解决方案

这就是您一般可以承诺回调的方式：

let doXWithCallback = callback => {
  // do x...
  callback();
};

let doXPromisified = () => new Promise(doXWithCallback);

doXWithCallback(() => console.log('do x with callback'));
doXPromisified().then(() => console.log('do x promisified'));

具体为您的示例：

let doRequest = () =>
        new Promise((resolve, reject) =>
                $.ajax({
                    headers: {
                        'Accept': 'application/json',
                        'Content-Type': 'application/json'
                    },
                    type: "GET",
                    url: '/user',
                    success: user => resolve(user.user_id),
                    error: reject(),
                }));

doRequest.then(userId => console.log('userId is', userId));

推荐阅读