[英]How to get JSON data from multiple URLS in ReactJS using search term in searchbox?
[英]How to get JSON data from multiple URLs
我需要从两个URL中获取数据并将其提取到单个表中。 我怎样才能做到这一点? 有人可以帮我怎么做吗? 提前致谢。
我尝试过的是这里。 但是它什么也没显示。
var url1 = 'http://localhost:8080/WebService/rest/payment/get/payment';
var url2 = 'http://localhost:8080/WebService/rest/orderdetails/get/all';
$(document).ready(function() {
$.when(
$.getJSON(url1),
$.getJSON(url2)).done(function(result1, result2) {
var table = $("#oTable");
$.each(result1, result2, function(i, value) {
table.append('<tr><td>1</td><td class="txt-oflo">' + value.payment + '</td><td>' + value.username + '</td><td class="txt-oflo">' + value.date + '</td><td><span class="text-success">' + value.price + '</span></td><td><a href=""><button class="btn btn-success">Place</button></a> <a href=""><button class="btn btn-danger">Cancel</button></a></td></tr>');
});
});
});
您可以将更新版本的请求与fetch
使用,并使用Promise.all
和await
(本机支持):
const url1 = 'http://localhost:8080/WebService/rest/payment/get/payment';
const url2 = 'http://localhost:8080/WebService/rest/orderdetails/get/all';
const fetchJSON = url => fetch(url).then(response => response.json())
$(document).ready(async () => {
const [result1, result2] = await Promise.all(fetchJSON(url1), fetchJSON(url2));
const results = [...result1, ...result2];
const table = $("#oTable");
results.forEach((value) => (
table.append('<tr><td>1</td><td class="txt-oflo">' + value.payment + '</td><td>' + value.username + '</td><td class="txt-oflo">' + value.date + '</td><td><span class="text-success">' + value.price + '</span></td><td><a href=""><button class="btn btn-success">Place</button></a> <a href=""><button class="btn btn-danger">Cancel</button></a></td></tr>')
));
});
deferred.done()-添加要解析Deferred对象时调用的处理程序。
您看不到响应可能是因为其中一项承诺被拒绝了。 尝试使用deferred.then()
或分别循环result1和result2
$.each(result1, function(i, value) {
table.append('<tr><td>1</td><td class="txt-oflo">' + value.payment + '</td><td>' + value.username + '</td><td class="txt-oflo">' + value.date + '</td><td><span class="text-success">' + value.price + '</span></td><td><a href=""><button class="btn btn-success">Place</button></a> <a href=""><button class="btn btn-danger">Cancel</button></a></td></tr>');
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.