![](/img/trans.png)
[英]Retrieve the status from multiple axios requests called from multiple components
[英]Multiple Axios GET requests from different components
我有2個不同的組件在主屏幕中呈現。 兩者都有多個axios.get請求來填充一些數據。 但是在第一頁加載時,只有最后一個組件返回數據,第一個組件等待60秒才能填充數據。 我不知道它是React問題還是我的快速服務器問題,所以這里是示例代碼
Main.JS
class App extends Component {
render() {
return (
<div>
<ComponentA />
<ComponentB />
</div>
);
}
}
ComponentA.JS
async componentDidMount() {
const live = await axios.get('api link');
const current = await axios.get('api link');
this.setState({
some states
})
}
ComponentB.JS
async componentDidMount() {
const live = await axios.get('api link');
this.setState({
some states
})
}
express.js
var express = require('express');
var app = express();
var sql = require('mssql');
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Credentials", "true");
res.header("Access-Control-Allow-Headers", "Origin,Content-Type, Authorization, x-id, Content-Length, X-Requested-With");
res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
next();
});
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
});
app.get('/api', function (req, res) {
res.end(some values)
})
就個人而言,我只是用.then()鏈接axios調用
axios.get('api link').then(data => {
let live = data
axios.get('api link2').then(data2 =>
let current = data2
})
})
這並沒有深入到你的所有組件和生命周期事件......但我希望可能會有所幫助。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.