[英]Accessing nested object values inside an array when using map to iterate over the array of objects
[英]Accessing single object in nested array when mapping over array of objects
抱歉,标题令人迷惑!
这是我在React中映射的数组的一小部分:
var listOfProductsToShow = [{
"markets": [{
"date": "2017-10-25",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWsDKs584lSNbhN1t",
},
{
"date": "2017-10-31",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWtWatedeIHOZZ1Dk",
},
{
"date": "2017-11-04",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWuWq1c22V2NBh12q",
},
],
"price": "9.99",
"product": "Chicken Wings",
"uid": "-KyRAxDoma3vwKXCiNBU",
"unit": "lb",
"vendorName": "Bob's Beef",
},
{
"markets": [{
"date": "2017-10-25",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWsDKs584lSNbhN1t",
},
{
"date": "2017-10-31",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWtWatedeIHOZZ1Dk",
},
{
"date": "2017-11-04",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWuWq1c22V2NBh12q",
},
],
"price": "9.99",
"product": "Burgers",
"uid": "-Kyax36Yo0Nr2fm01mgL",
"unit": "lb",
"vendorName": "Bob's Beef",
}
];
对于每个对象,我都试图访问市场数组,并且只在其中的第一个“市场”字段中访问。 我在下面尝试了以下操作,但出现错误。
{listOfProductsToShow.map((product, idx) => (
product.markets[0].market
))}
有什么办法可以做到这一点? 我知道我可以映射市场数组,但是我只想要第一个市场名称。 在此先感谢您的帮助!
您的markets
数组有时可能为空,导致undefined is not an object
错误。 您可以通过首先检查它是否存在来解决此问题,如果不存在则返回undefined。 然后最后过滤掉所有未定义的值:
var myArray = [ { "markets": [ { "date": "2017-10-25", "market": "Tribeca Farmer's Market", "uid": "-KxcWsDKs584lSNbhN1t", }, { "date": "2017-10-31", "market": "Tribeca Farmer's Market", "uid": "-KxcWtWatedeIHOZZ1Dk", }, { "date": "2017-11-04", "market": "Tribeca Farmer's Market", "uid": "-KxcWuWq1c22V2NBh12q", }, ], "price": "9.99", "product": "Chicken Wings", "uid": "-KyRAxDoma3vwKXCiNBU", "unit": "lb", "vendorName": "Bob's Beef", }, { "markets": [ { "date": "2017-10-25", "market": "Tribeca Farmer's Market", "uid": "-KxcWsDKs584lSNbhN1t", }, { "date": "2017-10-31", "market": "Tribeca Farmer's Market", "uid": "-KxcWtWatedeIHOZZ1Dk", }, { "date": "2017-11-04", "market": "Tribeca Farmer's Market", "uid": "-KxcWuWq1c22V2NBh12q", }, ], "price": "9.99", "product": "Burgers", "uid": "-Kyax36Yo0Nr2fm01mgL", "unit": "lb", "vendorName": "Bob's Beef", }, { "markets": [] } ]; console.log(myArray) var result = myArray.map(x => x.markets[0] && x.markets[0].market).filter(Boolean) console.log(result)
let array = [
{
"markets": [
{
"date": "2017-10-25",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWsDKs584lSNbhN1t",
},
{
"date": "2017-10-31",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWtWatedeIHOZZ1Dk",
},
{
"date": "2017-11-04",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWuWq1c22V2NBh12q",
},
],
"price": "9.99",
"product": "Chicken Wings",
"uid": "-KyRAxDoma3vwKXCiNBU",
"unit": "lb",
"vendorName": "Bob's Beef",
},
{
"markets": [
{
"date": "2017-10-25",
"market": "Tribeca1 Farmer's Market",
"uid": "-KxcWsDKs584lSNbhN1t",
},
{
"date": "2017-10-31",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWtWatedeIHOZZ1Dk",
},
{
"date": "2017-11-04",
"market": "Tribeca Farmer's Market",
"uid": "-KxcWuWq1c22V2NBh12q",
},
],
"price": "9.99",
"product": "Burgers",
"uid": "-Kyax36Yo0Nr2fm01mgL",
"unit": "lb",
"vendorName": "Bob's Beef",
},
];
let values = Object.values(array)
.map( item => { return item.markets })
.map( arrayIndexItem => arrayIndexItem.map( item2 => item2.market ) )
.map( it => it[0] );
console.log(values);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.