我現在已經嘗試了一個多星期，但似乎我不明白我可以在網上找到的所有例子..不知怎的，事情對我不起作用..
我從 API 獲得 JSON 作為回應，我想訪問 ArticleList 陣列中的資訊。但是，當我嘗試在 console.log 中顯示“未定義”的內容時......出于測驗目的，我添加了一個回傳 JSON 的函式，這樣我就可以在不呼叫 API 的情況下對其進行測驗。
這是我的代碼的最新版本：
function makeArrayOfArticleList() {
return {
data: {
FinalHelperCombinationList: [],
FinalCombinationList: [
{
ArticleList: [
{
Id: 54,
Description: "VT-U 20mm/4x10-20/140(30)",
Number: "719241",
Datasheet: "04.06-01_vt-u.pdf",
},
{
Id: 54,
Description: "VT-U 20mm/4x10-20/140(30)",
Number: "719241",
Datasheet: "04.06-01_vt-u.pdf",
},
],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
},
{
ArticleList: [
{
Id: 113,
Description: "VT-U 30mm/4x10-20/140(24)",
Number: "719230",
Datasheet: "04.06-01_vt-u.pdf",
},
{
Id: 114,
Description: "VT-U 10mm/4x10-20/140(40)",
Number: "719240",
Datasheet: "04.06-01_vt-u.pdf",
},
],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
},
{
ArticleList: [
{
Id: 51,
Description: "VT-B 15mm/4x10-15/140, 4Stege(40)",
Number: "719041",
Datasheet: "04.05-01_vt-b.pdf",
},
{
Id: 51,
Description: "VT-B 15mm/4x10-15/140, 4Stege(40)",
Number: "719041",
Datasheet: "04.05-01_vt-b.pdf",
},
{
Id: 114,
Description: "VT-U 10mm/4x10-20/140(40)",
Number: "719240",
Datasheet: "04.06-01_vt-u.pdf",
},
],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
},
],
},
};
}
const { FinalCombinationList: { ArticleList } } = makeArrayOfArticleList;
console.log(ArticleList);感謝您的幫助，謝謝。
問候埃里克
uj5u.com熱心網友回復：
從上面的評論...
“的OP具有解構/分配
FinalCombinationList正確排在首位（實際上是呼叫makeArrayOfArticleList函式）...const { data: { FinalCombinationList } } = makeArrayOfArticleList();... 2，有超過只是一個單一的ArticleList范圍內FinalCombinationList。因此說，什么是OP想ArticleList成為什么樣的？”
如果ArticleLista 的任何FinalCombinationList專案的所有s 都應該聚合/連接到一個陣列中，那么flatMap是正確的方法，而map確實回傳了一個ArticleLists陣列......
const { data: { FinalCombinationList } } = makeArrayOfArticleList();
const aggregatedArticleList =
FinalCombinationList.flatMap(({ ArticleList }) => ArticleList);
const listOfArticleLists =
FinalCombinationList.map(({ ArticleList }) => ArticleList);
console.log({ aggregatedArticleList, listOfArticleLists });.as-console-wrapper { min-height: 100%!important; top: 0; }<script>
function makeArrayOfArticleList() {
return {
data: {
FinalHelperCombinationList: [],
FinalCombinationList: [{
ArticleList: [{
Id: 54,
Description: "VT-U 20mm/4x10-20/140(30)",
Number: "719241",
Datasheet: "04.06-01_vt-u.pdf",
}, {
Id: 54,
Description: "VT-U 20mm/4x10-20/140(30)",
Number: "719241",
Datasheet: "04.06-01_vt-u.pdf",
}],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
}, {
ArticleList: [{
Id: 113,
Description: "VT-U 30mm/4x10-20/140(24)",
Number: "719230",
Datasheet: "04.06-01_vt-u.pdf",
}, {
Id: 114,
Description: "VT-U 10mm/4x10-20/140(40)",
Number: "719240",
Datasheet: "04.06-01_vt-u.pdf",
}],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
}, {
ArticleList: [{
Id: 51,
Description: "VT-B 15mm/4x10-15/140, 4Stege(40)",
Number: "719041",
Datasheet: "04.05-01_vt-b.pdf",
}, {
Id: 51,
Description: "VT-B 15mm/4x10-15/140, 4Stege(40)",
Number: "719041",
Datasheet: "04.05-01_vt-b.pdf",
}, {
Id: 114,
Description: "VT-U 10mm/4x10-20/140(40)",
Number: "719240",
Datasheet: "04.06-01_vt-u.pdf",
}],
TotalSize: 40,
HighSize: 40,
Category1: false,
Category2: false,
Category3: false,
Category4: false,
Category6: false,
Category7: false,
CombinationScore: 0,
}],
},
};
}
</script>uj5u.com熱心網友回復：
嘗試像這樣解構，因為 ArticleList 是陣列型別：
const {
data: {
FinalCombinationList: [ArticleList],
},
} = makeArrayOfArticleList();
有關更多詳細資訊，請參閱@VLAZ 評論。
uj5u.com熱心網友回復：
我不認為這種破壞在這里會起作用，它只回傳一個 ArticleList 陣列。在下面的示例中，使用 map 或 foreach 來獲取所有資料。
這將創建一個陣列，其中包含基于該函式的文章串列；
有了這個，您可以添加代碼以跳過重復項：
let articleList = [];
makeArrayOfArticleList().data.FinalCombinationList.forEach(e=> articleList = articleList.concat(e.ArticleList));
console.log(articleList);
或者只是（它只是輸出所有文章串列的組合：
makeArrayOfArticleList().data.FinalCombinationList.flatMap(e=> e.ArticleList);
或者根據要求，為每個文章串列拆分陣列
makeArrayOfArticleList().data.FinalCombinationList.map(e=> e.ArticleList);
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/371092.html
標籤：javascript 数组 json 接口 目的