无法在Axios调用之外获取值
问题：无法在Axios调用之外获取值。
回答： 在使用Axios进行异步请求时，常常会遇到在Axios调用之外无法获取到请求结果的问题。这是因为Axios请求是异步的，而JavaScript是单线程的，会继续执行后续的代码，而不会等待Axios请求的返回结果。因此，如果希望在Axios调用之外获取到请求结果，有以下几种常见的解决方案：
- 使用Promise对象或async/await：可以将Axios请求封装成一个Promise对象或使用async/await语法，以便在Axios请求返回后再继续执行后续的代码。示例代码如下：
function getData() {
return new Promise((resolve, reject) => {
axios.get(url)
.then(response => {
resolve(response.data);
})
.catch(error => {
reject(error);
});
});
}
getData()
.then(data => {
// 在这里可以获取到请求结果data，并进行后续操作
})
.catch(error => {
// 错误处理
});- 使用回调函数：可以将需要在Axios请求返回后执行的代码封装成一个回调函数，并将该函数作为参数传递给Axios请求的回调函数中。示例代码如下：
function getData(callback) {
axios.get(url)
.then(response => {
callback(response.data);
})
.catch(error => {
// 错误处理
});
}
getData(data => {
// 在这里可以获取到请求结果data，并进行后续操作
});- 使用事件触发机制：可以在Axios请求返回后手动触发一个自定义事件，然后在需要获取请求结果的地方监听该事件，并在事件回调中获取到请求结果。示例代码如下：
function getData() {
axios.get(url)
.then(response => {
// 触发自定义事件，并传递请求结果data
document.dispatchEvent(new CustomEvent('dataReady', { detail: response.data }));
})
.catch(error => {
// 错误处理
});
}
document.addEventListener('dataReady', event => {
const data = event.detail;
// 在这里可以获取到请求结果data，并进行后续操作
});
getData();这些解决方案可以根据具体的业务需求和代码结构选择合适的方式来获取Axios请求结果，并进行后续操作。在腾讯云的云计算服务中，推荐使用云函数SCF（Serverless Cloud Function）来处理后端逻辑，云数据库COS（Cloud Object Storage）来存储和管理数据，云服务器CVM（Cloud Virtual Machine）来进行服务器运维等操作。具体产品和服务介绍请参考腾讯云官方文档。
腾讯云云函数SCF：https://cloud.tencent.com/product/scf
腾讯云云数据库COS：https://cloud.tencent.com/product/cos
腾讯云云服务器CVM：https://cloud.tencent.com/product/cvm
相关·内容
我尝试过许多堆栈溢出解决方案，但无法解决这个问题。
我的代码在下面
助手/axos.js
import axios from "axios";
const instance = axios.create({
baseURL: process.env.REACT_APP_BACKEND_URI,
timeout: 1000,
headers: {},
});
export default instance;
App.js
import axios from "./helper/axios";
const { user } = useAppSel
浏览 2提问于2022-02-16得票数 0
回答已采纳
2回答
将变量设置为Axios调用
、、、、
在React中，我试图在返回数据后将一个变量设置为axios调用。但是，当控制台记录变量之后，这是一个承诺。如何从promise中获取值并将其设置为变量？
let fourPackProducts = axios.get('URL').then(response => {
return response.data })
console.log(fourPackProducts)
浏览 2提问于2018-02-17得票数 2
我正在使用React登录。我在我的一个组件中使用了Axios.post('/api/users/login', value)。现在，我想将userName和passWord存储在一个文件中，并使用Axios从本地文件中获取值。我想有一个固定的用户名和密码的用户登录。 可以使用Axios.post()从本地文件中获取值吗？
浏览 44提问于2019-12-08得票数 0
1回答
混杂值未定义公理
、、
我试图使用axios获取值，并在浏览器上返回[PromisseValue]未定义的值。按照我的代码。拜托，帮帮我.谢谢
<script>
export default {
props: ['endpoint'],
data () {
return {
response: {
table: '',
displayable: [],
rec
浏览 0提问于2018-05-18得票数 0
回答已采纳
如何从axios响应创建上下文？
import React, { createContext } from 'react';
import axios from 'axios';
const AppContext = createContext({
lang: 'en',
currency: 'USD',
name: 'Demo store'
});
const token = JSON.parse(localStorage.getItem('token'));
axios.ge
浏览 6提问于2020-04-08得票数 1
回答已采纳
2回答
我正在尝试从another请求中获取值，该请求存储在另一个文件postData.js中的函数中。
const BaseURL = 'http://127.0.0.1:8000/api/';
export const getData = (location) => {
return axios.get(`${BaseURL}${location}`).then(res => res.data)
.then((data) => {
return data;
})
}
在console.log(‘getData/’)中，在其他文件的组件中，我
浏览 1提问于2019-04-17得票数 1
回答已采纳
3回答
我在子组件中有一个方法，它负责从服务器获取数据，在接收数据后，我试图将数据发送给父组件。下面的方法来自Vue.component (子)。问题是，父组件无法接收发出的数据。为了检查，我将$emit代码移到axios请求调用之外，然后它就开始工作了。如果我从内部$emit axios，它是不工作的。
不工作(从内部axios发出)：
methods:{
methodName: function(){
let self = this;
axios.get('url')
.then(function(response){
浏览 2提问于2017-05-25得票数 3
回答已采纳
我是javascript和vue的初学者。我正在使用动态路由，并试图在页面加载时将数据从本地API (Graphql，通过阿波罗)传递到Openweathermap。问题是openweather返回400，因为除非我刷新页面，否则URL将传递一个空值(this.city)。在axios (或fetch)尝试从openweather获取任何数据之前，我一直无法弄清楚如何从本地API中获取值(城市名称)。
简单地说，： this.city作为空值传递给axios，它从API返回400个错误，除非我刷新页面(它也不总是工作的)。
这是我的密码：
<script>
import ven
浏览 7提问于2021-03-15得票数 2
回答已采纳
已是最新版本sdk4.6.102 无法获取历史消息返回条数为0 或获只能获取到加入群组后收到的消息，无法获取之前的
浏览 202提问于2020-03-12
在使用jest运行测试时，我具有基本的测试适应语法：
jest.mock('axios');
describe('app', () => {
let render
beforeEach(() => {
axiosMock.get.mockResolvedValueOnce({
data: {greeting: 'hello there'},
}),
render= renderApp()
});
test('shoul
浏览 11提问于2020-02-26得票数 13
回答已采纳
2回答
我正在尝试为我的搜索树获取一些数据，但我无法直接从axios获取数据，也无法调用函数，因为它找不到这些数据。
export default {
name: 'SideNavMenu',
data () {
return {
searchValue: '',
treeData: this.getData(),
treeOptions: {
fetchData(node) {
this.onNodeSelected(node)
}
},
}
},
在d
浏览 0提问于2019-04-11得票数 0
2回答
如何使用VueJS迭代数组的值？
、、、、
我正在用Laravel5.3开发。我也使用分形。我还将axios作为Http客户端来执行Ajax请求。
如果我发送一个get请求显示所有椅子api。本人获发还，并附有以下展示：
我使用VueJS 2将值解析为html视图。
ChairsController.php
public function index()
{
$chairs = Chair::paginate(25);
// Return a collection of $chair with pagination
return $this->response->withPaginator($c
浏览 2提问于2016-12-26得票数 4
1回答
如果我因丢失或被盗的美国运通白金卡而获发一张新卡，账户号码的前10个号码是否会保持不变，只剩下最后5个号码，还是仍然使用第一组10个号码？
浏览 0提问于2017-10-01得票数 0
我正在将重构为。
当jQuery文件上传请求(上传jpg文件)时，我在Chrome工具中注意到了这种有效负载
查看源代码
如果我想使与jQuery文件上传在Axios中所做的相同，我必须这样做：
<input type="file" id="file-selector" />
document.getElementById("file-selector").addEventListener("change", (event) => {
const formData = new window
浏览 8提问于2020-12-08得票数 0
回答已采纳
当我通过useEffect之外的axios发出请求时，它会触发两次，即使页面上没有其他呈现？
注意，只触发两次axios，而不是普通的console.log。
完整的代码如下：
import axios from "axios";
function App() {
console.log('only once') // this is triggered only once
axios.get('https://jsonplaceholder.typicode.com/users')
.then(res => {
浏览 3提问于2022-02-23得票数 1
1回答
我是个新手，希望能从这个社区学到很多东西。
我有一个BoredAPI.js文件，它从"Kanye“中获取值，并将传递的值设置为setValues useState in App.js。除此之外，我还使用了现有帖子中显示的async/await属性，比如- 。但是，我继续在控制台日志Promise {<Pending>}中出现错误console.log("App Statement: ", BoredAPI());。
有人能给我提供关于我做错了什么的见解吗？我真的很感激你能提供的任何帮助。谢谢。
App.js
import { useState, useEff
浏览 1提问于2021-07-06得票数 0
回答已采纳
我创建了一个REST Api。在前面，我使用axios发送post值。(我使用ReactJS)。回到Symfony，在我的控制器中，我想要获取post值。我该怎么做呢？我做到了： 从前面看： const data = new FormData();
let postData = {
source: 'lcl',
userLastname: lastname,
userFirstname: firstname,
text: message,
}
da
浏览 31提问于2019-01-14得票数 1
我在我所有的vue模块中都这样做 import axios from 'axios'
axios.defaults.xsrfHeaderName = 'X-CSRFTOKEN'
axios.defaults.xsrfCookieName = 'csrftoken'
axios.defaults.withCredentials = true 我不想重复这一点，最好这样做 import axios from './myaxios' 我试过了： import axios from 'axios'
function m
浏览 9提问于2019-02-22得票数 0
回答已采纳
2回答
我正在准备一次考试，在看了一些示例练习(其中包含正确答案)后，我根本无法理解它们。
问题是
(多项选择)：下面的计划有哪些可能的结果？
A)取值为1，取值为1，最终取值为1
B)取值为1，取值为1，最终取值为2
C)取值为1，最终取值为1，取值为2
D)取值为1，最终取值为2，取值为2
程序
public class Thread2 extends Thread {
static int value = 0;
static Object mySyncObject = new Object();
void increment() {
int tmp
浏览 13提问于2011-02-04得票数 12
回答已采纳
2回答
我对react还很陌生，对于如何在react中使用返回给对get服务的axios get调用的数据来创建键-值对对象有一个疑问。在状态下保存对象，然后根据键读取值。 axios.get('/api/locations/')
.then(r => r.data )
.then(types => this.setState({types})) 我从后端得到一个List<LocationType>，LocationType对象有两个属性： String locationId
String locationName 现在我想使用types对象创
浏览 16提问于2019-05-03得票数 0
我一直在寻找一个字体，包括在我的游戏，支持符文字符，特别是这个Unicode块。
我所访问的所有站点都没有演示该字体包含哪些Unicode字符，因此我无法对它们的有用性进行评估。
我一直在使用Segoe符号字体，但它只能在Win 7和8上使用，据我所知，作为游戏的一部分重新分发的成本太高了。
有人知道我在哪里可以找到一个字体与我的要求吗？
浏览 0提问于2015-11-01得票数 3
回答已采纳
在所有的onEnter钩子的反应路由器例子中，钩子是同步的.在这些问题上，我们建议保持这种状态。在钩子里登录某人的惯用方法是什么？
用户故事：
客户端有一个localStore令牌
客户端直接导航到example.com/mustBeLoggedIn
在进入该页面之前，我想检查他们是否有令牌，如果有，尝试获得授权。如获授权，请继续沿路线行驶。
我应该只使用一个临时的而不是onEnter吗？
目前我已经让它工作了，但是我知道它不被推荐，而且看起来非常脆弱，例如使用不可变的存储会导致与这个问题相同的问题：
浏览 2提问于2016-01-05得票数 2
回答已采纳
1回答
我在做一个Vue应用。我有一个场景，我必须使用Authorization头信息调用服务，而我得到的是HTML (带有预先呈现的图表的整个页面)，我必须在组件中显示它。 问题是，响应中的HTML有一堆CSS、JS和图像文件的相对路径。当我将HTML绑定到我的组件时，它采用的是我的本地主机的相对路径，而不是它所来自的服务器。因此，它无法找到要加载的必要文件。 如果我输入相同的URL端点，并使用mod-header扩展从Chrome传递Authorization头信息，我就能够看到呈现的页面。 我尝试过使用v-html和iframes来渲染HTML，但是不起作用。还尝试将Host作为标头信息进行传
浏览 20提问于2020-04-21得票数 0
1回答
如何测试中间件中返回的请求值
、、、、
我是个新手，我有这样的东西要测试。 function getProfit() {
let profit = 0;
** some axios called where profit is updated form the returned value **
return (req, res, next) => {
req.properties = {
profit,
};
next();
};
}
module.exports = {
getProfit,
}; 我想测试这个函数的返回值。我试过这样的方法，但不起作用： c
浏览 27提问于2021-08-25得票数 0
回答已采纳
我在把csv文件拷贝到卡桑德拉。我有下面的csv文件，表如下所示。
创建表UCBAdmissions(
id int PRIMARY KEY,
admit text,
dept text,
freq int,
gender text
)
当我使用从'UCBAdmissions.csv‘中复制UCBAdmissions.csv= '，’和HEADER = TRUE；
输出是
在0.318秒内导入24行。
cqlsh>从UCBAdmissions中选择*；
身份证，承认，部门，女性，性别
(0行)
从“UCBAdmissions”中复制“UCBAd
浏览 3提问于2015-12-15得票数 1
2回答
如何从提供程序到函数响应共享数据
、、、、
我创建了一个NPM库，它共享多个util函数。其中之一就是打电话给我们的端点。我已经在我的NPM库中包含了Axios，但是我只能在全球范围内设置Axios.create实例。
我最初以为我可以创建一个Provider并设置一个context，但是，由于我的API函数不在钩子中，所以我无法访问上下文。这是我第一个不熟悉什么是最佳实践的NPM库。
// Provider.ts
export default function Provider({ children, config }: ProviderProps) {
window.config = config;
return (
浏览 2提问于2022-09-27得票数 2
回答已采纳
我有两份文件。一个是"actions.js“，另一个是"Profile.js”。第一个文件有一个函数，该函数调用一个API，该API将根据用户的id获取有关该用户的信息。
"actions.js“的代码是：
import axios from "axios";
export const getPerson = (id, history) => async dispatch => {
try {
const res = await axios.get(`http://localhost:6969/users/getUsers/${i
浏览 4提问于2021-09-14得票数 2
2回答
等待承诺完成
、、、、
我正在制造一个不和谐的机器人，并试图构造得更好一点。
message.channel.send(require('./commands/' + inputs[0] + '.js')(inputs));
这将需要一个文件并将返回的消息发送到通道。这是这样一个文件的示例：
module.exports = commands => {
let returnM = '';
axios.get(some url).then(response => {
returnM = response.data.whatever;
}
浏览 0提问于2018-02-10得票数 1
回答已采纳
2回答
我是reactJs的新手，我需要使用axios调用从DB获取值，但它显示404错误，这是我的代码
axios({
method: 'POST',
contentType: 'application/json; charset=utf-8',
url:'http://localhost/projectName/backend/web/category-master/fetch-category',
responseType: 'json'
})
浏览 2提问于2020-02-04得票数 0
节点无法找到我安装的axios包。在国家预防机制中，我尝试了以下几点(认为这是国家预防机制的问题)：
npm uninstall axios
npm cache clean --force
npm install axios
npm uninstall axios
npm cache clean --force
npm install axios -S
在我的app.js文件中，我列出了以下与节点相关的axios状态：
const axios = require('axios');
我还尝试了以下几点：
const axios = require('axios'
浏览 16提问于2022-10-12得票数 0
回答已采纳
我正在为一个简单的反应应用程序编写一些玩笑酶测试，使用类型记录和新的反应钩子。
但是，我似乎无法正确地模拟在useEffect钩子中进行的api调用。
useEffect调用api并用"setData“更新useState状态”数据“。
然后将对象“数据”映射到表中对应的表单元格中。
这看起来应该很容易用模拟的api响应和酶装载来解决，但是我总是收到错误，告诉我使用act()进行组件更新。
我尝试过多种使用act()的方法，但都没有效果。我已经尝试用axios替换为提取和使用酶浅和反应测试库的渲染，但似乎没有任何效果。
组件：
import axios from 'axios&
浏览 0提问于2019-03-28得票数 35
回答已采纳
1回答
回复状态不更新后，发布请求？
、、、、
我试图用axios将post请求发送到后端，我的后端没有问题地获得值，但是当post请求被“成功发送”时，我想将(已发送)状态设置为true，在axios请求之后将setSent(true)放在.then()中。但是当我发送请求时，状态没有更新！有什么问题吗？后端获取值并运行良好，尽管..。请参见下面的代码：
const submitHandler = () => {
axios
.post(
"/sendFeedback",
qs.stringify({
name,
email,
浏览 4提问于2021-01-24得票数 4
1回答
我无法通过axios设置标题，例如，将内容类型设置为application/json。axios没有抛出异常，但请求在浏览器中获得"415不支持的媒体类型“响应。有我犯错的线索吗？
以下是密码-
我试过两种方法。
方法1-
import axios from 'axios';
axios.defaults.headers.common['Content-Type'] = 'application/json';
axios.get(url).then(
response => this.loadData(response)).ca
浏览 1提问于2018-04-11得票数 2
回答已采纳
我知道有很多类似的问题，但所有的答案都是使用异步函数和等待函数调用inside...which，我已经在做了。在经历了几个小时的猛烈抨击之后，如果你觉得有必要的话，我需要请求question...Feel自由否决，但我一直在寻找答案。
所以我有点迷惑，可以多看一眼。我正在使用Axios从API调用返回数据。我有一个异步函数发送请求，并等待axios.get函数请求。所以在我看来，它应该返回数据，而不是一个承诺。然而，它返回了一个promise，而我尝试过的任何东西都不会返回数据。我可以通过控制台记录它，它会输出数据，但实际返回的是promise对象。如果有人能告诉我这里出了什么问题，我将不胜感
浏览 0提问于2021-02-08得票数 0
4回答
在axios实例中使用状态令牌
、、、、
我有一个从api中获得的令牌状态：
const initialState = {
isAuth: false,
token: "",
};
我想在Axios实例中重用令牌：
const api = axios.create({
baseURL: `${baseUrl}`,
headers: {
Authorization: `Bearer ${token}`,
},
});
export default api;
问题是，我无法通过useSelector将令牌读取为：
const token = useSelector((state) =>
浏览 12提问于2022-09-13得票数 1
回答已采纳
这是我的application.tsx文件：
import axios from '../util/axios';
const fetchApplications = () => {
return axios
.get('/portal-appmanager/v1/applications', {
responseType: 'json',
})
.then(response => {
return response.data;
})
.catch(error
浏览 1提问于2021-06-17得票数 1
我有一个Laravel Lumen 7 RESTful应用编程接口，还有一个带有Axios的Nuxt前端。我的前端向API发出Axios调用，在Lumen项目内部，我当然会返回相关的响应和错误代码。然而，似乎这些响应虽然我在检查网络时可以看到它们，并且可以在预览/响应选项卡中看到它们，但我无法从我的catch()块中的Axios访问它…… 如果我将其更改为200响应，那么我可以从我的then()块访问它，但这并不理想。 管腔响应 return response()->json(['success' => false, 'message' =>
浏览 18提问于2020-09-03得票数 0
回答已采纳
我正在尝试使用一个自定义的Axios钩子来获取一些数据，但是我得到了一个错误，上面写着“无效的钩子调用。钩子只能在函数组件的主体内调用。”我知道这听起来很明显，但对于新手来说，这并不是很有意义。 这里是钩子： import { useState } from "react";
import axios from "axios";
export default useApi = () => {
const [data, setData] = useState([]);
const [error, setError] = useState(fals
浏览 12提问于2020-07-28得票数 0
我刚开始响应查询，在文档之后，我发现了一个问题，就是我正确地实现了帮助。
错误：
错误:没有QueryClient设置，使用QueryClientProvider设置一个
import { QueryClient, QueryClientProvider, useQuery } from 'react-query'
import axios from 'axios';
const queryClient = new QueryClient()
export default function App() {
const
浏览 2提问于2021-08-02得票数 1
回答已采纳
区号：
const axios = require('axios')
const uuid = require('uuid').v1();
const rand = Math.random();
exports.lambdaHandler = async (event) => {
//const uuix = uuid.v1();
return {
statusCode: 200,
body: JSON.stringify({
message: uuid,
r
浏览 4提问于2020-12-19得票数 0
回答已采纳
2回答
在特定对象的生存期内，this指针的值是否保证为常量？我无法想象有什么情况会改变，但我不知道我是否遗漏了什么。
浏览 2提问于2020-01-15得票数 19
回答已采纳
我无法更新需要从songsList获取值的状态歌曲。如何将歌曲更新为songsList？这与组件的生命周期有关吗？当运行下面的代码时，“songsList is undefined”错误抛出。const songList在渲染中。
import React, { Component } from 'react';
import logo from './components/Logo/box8.png';
import './App.css';
import SearchBox from './compon
浏览 0提问于2018-09-22得票数 3
1回答
当前场景
我有一个部署在JBoss服务器上的react应用程序，现在这个已部署的war文件有一些axios调用的，它从后端服务器部署的war文件中获取数据。
现在，这个后端服务器的端口和IP是用axios调用硬编码的，目前不能动态地更改。示例：- axios.get(')
所需的场景
现在，我们需要在部署我们的React之后，如果我们的后端部署更改为允许服务器- 176.153.xxx.xxx:9000来自192.168.xxx.xxx:8080，，我们就不需要重新部署我们的前端代码，这样我们就可以直接从属性或json文件读取ip和端口。
因此，如果我在react项目中的SRC中创建
浏览 7提问于2021-03-01得票数 1
我正在尝试使用Axios(这是我第一次使用Axios)调用react应用程序(TSX)的API，每次我运行应用程序时，方法都会更改为'OPTIONS‘，请求就会失效。我们将非常感谢您的帮助。共享我的代码很抱歉，出于安全原因，我隐藏了身份验证令牌。
代码
import React, { useState, useEffect } from 'react';
import axios from 'axios';
interface Brands {
BrandId: number;
Name: string;
}
const AUTH_TOKEN
浏览 1提问于2020-09-05得票数 0
我有一个仪表板组件，它呈现一些小部件。它从四个不同的API中获取小部件数据。
Dashbaord.jsx
import { Box, Stack } from '@mui/material';
import { useAxios } from '../../api/use-axios';
import { NewWidget } from '../../components/widget/NewWidget';
import ApiConfig from '../../api/api-config';
const Dashboa
浏览 2提问于2022-05-22得票数 0
回答已采纳
1回答
const headers = new Headers({
'access_token' : accToken,
'Content-Type': 'application/json',
});
axios.post(baseURI, data, {
headers: headers
})
.then((response) => {
浏览 22提问于2021-04-15得票数 0
回答已采纳
这是的后续问题
我正在使用reactjs，下面是我所做的工作:从API中检索数据并使用axios显示数据以调用API。我知道axios调用是异步的，并且是基于承诺的。
下面是抛出错误的代码：
class StudentsPage extends React.Component{
constructor(props){
super(props);
this.state = {
isLoaded: false,
studentListArray: []
}
}
componentDidMount(){
console.
浏览 0提问于2020-05-26得票数 0
回答已采纳
3回答
我有一个axios配置文件，我在该文件中调用react钩子{Auth Context}，目的是在中获取令牌。但是我得到了一个类似于的错误“React 'useAuth‘不能在顶层调用，必须在React函数组件或自定义React函数”中调用React。
AuthContext.js
import React, { useContext, createContext, useState } from "react";
const AuthContext = createContext();
export function useAuth() {
return use
浏览 7提问于2021-09-26得票数 1
如何从查询字符串中获取值并将其传递给Axios？非常感谢提前，并非常感谢任何帮助。这是我所拥有的。谢谢
http://localhost:3000/article/id/5ff15120a012a42238acdcd6
useEffect(async() => {
const response = await Axios.get(process.env.REACT_APP_FETCH_URL + '/api/article/id',{params:???}, {withCredentials:true})
setArtc
浏览 0提问于2021-01-03得票数 0
守则是：
var data;
axios.get('http://localhost:3000/api/goodNews').then(result => {
data = result;
console.log(data); //This work
return data;
});
console.log(data)//this don't work
目标是从axios获得答案，以便在此代码所在的组件中使用。但是，我无法从the ()函数中获取这些信息。有时它会返回未定义的内容，如果是这样的话：
var data;
浏览 0提问于2021-01-26得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
