非React项目中如何从Axios Promise中提取请求数据？

你的问题根源在于Axios请求是异步操作，返回的是Promise对象，直接打印name(1)时，异步请求还未完成，所以输出的是处于pending状态的Promise。下面给你两种原生JS解决方案，无需依赖React：

方案1：用.then()链式处理结果 #

既然name函数返回的是Promise，你可以在调用它后通过.then()拿到最终数据：

const axios = require("axios")

const query = (id="", table="businesses") => (
    axios.get(`http://localhost:3001/${table}/${id}`)
)

const name = (id) => {
    return query(id.toString())
        .then(res => res.data)
        .catch(err => {
            console.error("请求出错：", err);
            throw err; // 抛出错误，让后续逻辑可捕获处理
        })
}

// 调用函数并处理返回数据
name(1).then(data => {
    console.log("data:", data);
}).catch(err => {
    // 这里可统一处理请求错误
});

方案2：用async/await语法（更直观） #

async/await是ES8语法，能让异步代码看起来像同步逻辑，但必须在async函数内部使用await：

const axios = require("axios")

const query = (id="", table="businesses") => (
    axios.get(`http://localhost:3001/${table}/${id}`)
)

const name = (id) => {
    return query(id.toString())
        .then(res => res.data);
}

// 定义async函数执行请求
async function getDataAndLog(id) {
    try {
        const data = await name(id);
        console.log("data:", data);
    } catch (err) {
        console.error("请求出错：", err);
    }
}

// 触发异步操作
getDataAndLog(1);

关键注意点 #

• 不要在name函数的.catch()里只打印错误却不抛出，否则Promise会被标记为resolved状态，返回undefined，后续无法捕获错误。
• 所有依赖异步数据的逻辑，必须放在.then()回调或async函数的await之后，不能在同步代码里直接获取异步结果——因为异步操作完成前数据还不存在。

内容的提问来源于stack exchange，提问作者Nolan