javascript - axios函数调用不会返回数据
问题描述
我确定这是我的理解/实施的问题。问题是我试图将创建的对象的 ID 返回到一个数组中,以便以后可以将数组插入到另一个对象中。在函数、调用之间移动 .then() 似乎没有任何效果。推送到数组,通过索引将值分配给数组似乎不起作用。任何关于根本问题是什么以及解决问题的途径的见解/指导都值得赞赏。
index.js
const contacts = document.getElementsByName('newContact');
const contactName = document.getElementsByName('contactName');
const contactTitle = document.getElementsByName('contactTitle');
const contactPhone = document.getElementsByName('contactPhone');
const contactEmail = document.getElementsByName('contactEmail');
let contactIDArray = new Array();
for (let i = 0; i < contacts.length; i++) {
const name = contactName[i].value;
const title = contactTitle[i].value;
const phone = contactPhone[i].value;
const email = contactEmail[i].value;
var id;
createContact(name, title, phone, email).then(function (res) {
id = res.data.id;
alert(res.data.id);
return id;
});
alert(id);
联系.js
import axios from 'axios';
export const createContact = async (contactName, contactTitle, contactPhone, contactEmail) => {
try {
const res = await axios({
method: 'POST',
url: '/api/v1/contacts',
data: {
contactName,
contactTitle,
contactPhone,
contactEmail,
},
});
return res.data.id;
} catch (err) {
console.log(err);
}
};
解决方案
我可以看到多个问题:
- 正如 VLAZ 在评论中所说,您正在尝试获取
.data.id
一个已经是 id 的值 Promise
应该使用util提供的工具来创建一系列承诺( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all可能是您正在寻找的)。
例如,我会按照这些思路去做(未经测试):
const contacts = document.getElementsByName('newContact');
const contactName = document.getElementsByName('contactName');
const contactTitle = document.getElementsByName('contactTitle');
const contactPhone = document.getElementsByName('contactPhone');
const contactEmail = document.getElementsByName('contactEmail');
let contactIDArray = new Array();
const requests = []
for (let i = 0; i < contacts.length; i++) {
const name = contactName[i].value;
const title = contactTitle[i].value;
const phone = contactPhone[i].value;
const email = contactEmail[i].value;
var id;
promise = createContact(name, title, phone, email).then(function (res) {
const id = res.data.id;
alert(res.data.id);
return id;
});
requests.push(promise)
}
Promise.all(requests).then(ids => {
// This should contain the array of ids
alert(ids)
})
编辑:另外,在同步和异步调用之间共享结果时要小心,通常一旦你开始你的异步任务,你就会留在异步世界中,如此处所述:How to return data from promise
推荐阅读
- flutter - Flutter 列表查询
- python - 范围为“类”的 Pytest 夹具不适用于“setup_class”方法
- c# - 在操作方法中使用 HttpServerUtilityWrapper 时,获取为此对象定义的无参数构造函数
- ruby - 使用厨师安装kafka期间文件解压缩错误
- paypal - 更改订阅计划和计费差额
- python - KIVY:如何多任务处理
- mysql - 尝试在 Ubuntu 20.04 中安装 mysql 时未满足的依赖项
- angular - Buttonclick 上的 Angular 9 Reloading Component 仅每秒钟工作一次
- python - 如何为要在 Django 管理员上显示的上传视频提供用户明智的数字
- java - 在 apache camel 中使用 xpath 从 xml 中获取值