如何在反应中推送 JSON 对象数组中的项目?
我有我的 REACT JS 客户端并使用 PHP API 来获取数据.我从 API 调用中获取 JSON 对象数组,格式如下:
I have my REACT JS client side and using PHP APIs to fetch data. Im fetching the JSON Object array from API call, in the following format:
{
"records": {
"Master Automotives": [
{
"SparePartID": "43",
"Name": "Oil and Lubricants",
"Price": "4500",
"VendorID": "48",
"CompanyName": "Master Automotives"
},
{
"SparePartID": "45",
"Name": "Lights",
"Price": "2300",
"VendorID": "48",
"CompanyName": "Master Automotives"
}
],
"Repair Solutions": [
{
"SparePartID": "47",
"Name": "Steering Wheel",
"Price": "1500",
"VendorID": "60",
"CompanyName": "Repair Solutions"
}
],
"FiveStar Automotives": [
{
"SparePartID": "51",
"Name": "Brakes",
"Price": "234",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
},
{
"SparePartID": "53",
"Name": "Clutch",
"Price": "999",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
},
{
"SparePartID": "55",
"Name": "LED",
"Price": "288",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
}
]
}
}
从 API 响应中,我想将上述响应数据(NAME 和 PRICE)保存在 myrecords[] 的 this.state(最初为空)另外我还想向上面推送更多项目JSON,就像对于每个 SPAREPART 我想为每个数据添加数量"和总价格"项.
From API response, I want to save the above response data (NAME and PRICE) in this.state of myrecords[] (which is empty initially) Plus I also want to push some more items to this above JSON, like for each SPAREPART I want to add "Quantity" and "TotalPrice" items for each data.
我正在尝试使用 .push 方法添加这些 Quantity &每个数据项的总价格.这是我的 REACT API 调用,我在其中获取数据并通过 myrecords[] 的 setState 保存它,并在其中推送更多项目,但它不起作用并显示 ERROR msg.请帮助我如何正确推送项目.
Im trying to use .push method to add these Quantity & TotalPrice for each data item. here is my REACT API call where I m fetching data and saving it by setState of myrecords[] and pushing more items in it but IT DOESN'T WORK and shows ERROR msg. please HELP ME how to PUSH the items correctly.
axios.post('http://localhost/Auth/api/customers/show_cart.php', arr,
{
headers: {'Accept': 'application/json, text/plain, */*',
'Content-Type': 'application/json'}
} )
.then(response => {
console.log(response.data.records);
let myItems = [];
response.data.records.forEach((item) => {
myItems.push({SparePartID: item.SparePartID,
Name: item.Name,
Price: item.Price,
Quantity: 1,
totalPrice: item.Price});
})
this.setState({
myrecords: myItems
})
})
.catch(error => {
if (error) {
console.log("REACT Error. Cannot show cart items"); }
});
您可以将对象转换为数组并对其进行 foreach
You can convert your object to array and foreach it
let myItems = [];
let result = Object.entries(response.records).map(( [k, v] ) => ({ [k]: v }));
result.forEach((item) => {
var key = Object.keys(item)[0];
item[key].forEach((sub)=>{
myItems.push({SparePartID: sub.SparePartID,
Name: sub.Name,
Price: sub.Price,
Quantity: 1,
totalPrice: sub.Price});
})
});
let response = {
"records": {
"Master Automotives": [
{
"SparePartID": "43",
"Name": "Oil and Lubricants",
"Price": "4500",
"VendorID": "48",
"CompanyName": "Master Automotives"
},
{
"SparePartID": "45",
"Name": "Lights",
"Price": "2300",
"VendorID": "48",
"CompanyName": "Master Automotives"
}
],
"Repair Solutions": [
{
"SparePartID": "47",
"Name": "Steering Wheel",
"Price": "1500",
"VendorID": "60",
"CompanyName": "Repair Solutions"
}
],
"FiveStar Automotives": [
{
"SparePartID": "51",
"Name": "Brakes",
"Price": "234",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
},
{
"SparePartID": "53",
"Name": "Clutch",
"Price": "999",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
},
{
"SparePartID": "55",
"Name": "LED",
"Price": "288",
"VendorID": "70",
"CompanyName": "FiveStar Automotives"
}
]
}
}
let myItems = [];
let result = Object.entries(response.records).map(( [k, v] ) => ({ [k]: v }));
result.forEach((item) => {
var key = Object.keys(item)[0];
item[key].forEach((sub)=>{
myItems.push({SparePartID: sub.SparePartID,
Name: sub.Name,
Price: sub.Price,
Quantity: 1,
totalPrice: sub.Price});
})
});
console.log(myItems);