我正在尝试过滤掉数组中包含字符串的对象。我将其放在对象数组中。
我有这个：
[
{
articles: {
id: "1",
title: "Great food article",
featured: false,
paid: false,
image: img1,
author: "Chocolate Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food"
]
}
},
{
articles: {
id: "2",
title: "Good tech article",
featured: false,
paid: false,
image: img2,
author: "Candy Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Adventure"
]
}
},
{
articles: {
id: "3",
title: "Nice adventure article",
featured: false,
paid: false,
image: img3,
author: "Lollypop Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food",
"Adventure"
]
}
},
]
如果我比较“食物”的字符串，我想返回两个在其“标签”数组中包含“食物”的对象。
filterArticles = () =>{
let{
articles, tags
} = this.state
let tempArticles = [...articles];
console.log(tempArticles)
//Making array of arrays of articles tags
let array1 = [...new Set(tempArticles.map(item => item["tags"]))];
//Making the array of arrays flat to one dimensional array
let array2 = [...new Set(array1.flat(1))];
console.log(array2)
console.log(tags)
}
其中tempArticles具有所有3个对象，并且标签具有值food，但是它仅返回数组中所有3个标签的数组。
期望1和3个对象。
感谢解释的帮助，因为我想花一会儿时间。
var array = [
{
articles: {
id: "1",
title: "Great food article",
featured: false,
paid: false,
image: '',
author: "Chocolate Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food"
]
}
},
{
articles: {
id: "2",
title: "Good tech article",
featured: false,
paid: false,
image: '',
author: "Candy Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Adventure"
]
}
},
{
articles: {
id: "3",
title: "Nice adventure article",
featured: false,
paid: false,
image: '',
author: "Lollypop Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food",
"Adventure"
]
}
}
]
var foodArray = array.filter(value => value.articles.tags.includes('Food'));
console.log(foodArray);这里是伙伴，但是用变量替换image属性中的字符串
const array = [
{
articles: {
id: "1",
title: "Great food article",
featured: false,
paid: false,
image: "image",
author: "Chocolate Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food"
]
}
},
{
articles: {
id: "2",
title: "Good tech article",
featured: false,
paid: false,
image: "iamge",
author: "Candy Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Adventure"
]
}
},
{
articles: {
id: "3",
title: "Nice adventure article",
featured: false,
paid: false,
image: "image",
author: "Lollypop Boy",
date:"1-2-2020",
description:
"Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food",
"Adventure"
]
}
},
];
const filteredArray = array.map(item => item.articles.tags.includes("Food") && item);
console.log(filteredArray);您可以使用javascript的过滤方法：
arr.filter(ob => {return ob.articles.tags.includes("Food")})
arr是您发布的数组。
您可以使用Array.filter（）过滤数组并使用indexOf()检查Food项。
const newArr = arr.filter((item) => ( item.articles.tags.indexOf('Food') > -1 ));
console.log(newArr); // 2 items which have the Food tag
const arr = [{
articles: {
id: "1",
title: "Great food article",
featured: false,
paid: false,
image: 'img1',
author: "Chocolate Boy",
date: "1-2-2020",
description: "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food"
]
}
},
{
articles: {
id: "2",
title: "Good tech article",
featured: false,
paid: false,
image: 'img2',
author: "Candy Boy",
date: "1-2-2020",
description: "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Adventure"
]
}
},
{
articles: {
id: "3",
title: "Nice adventure article",
featured: false,
paid: false,
image: 'img3',
author: "Lollypop Boy",
date: "1-2-2020",
description: "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
tags: [
"Tech",
"Food",
"Adventure"
]
}
},
]
const result= arr.filter(x=>x.articles.tags.includes('Food'))
console.log(result)