更新时间:2023-02-14 14:19:39
根据该问题,您的JSON数组有4个对象,但是只有3个对象具有称为 resultlist
&的嵌套数组.还没有1个对象.
According to the problem, your JSON array has 4 objects but only 3 of them have nested array called resultlist
& 1 object hasn't.
{
"img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
"product_id": 187,
"sort_order": 1,
"status": true,
"type": "middleimage",
}
这会导致错误 undefined不是对象(评估"item.resultlist.map")
,因为您需要一个数组才能在JS中使用 map
.但是该对象没有结果列表
.
That's cause error undefined is not an object (evaluating 'item.resultlist.map')
because you need an array in order to used map
in JS. But that object hasn't resultlist
.
这是您需要从后端处理的事情.如果没有,则可以通过添加 resultlist:[]
来过滤该对象或更改该对象的结构,如下所示.
That is something you need to handle from the backend. If not you can filtered that object or change structure of that object by adding resultlist:[]
as below.
import * as React from "react";
import { Text, View, StyleSheet } from "react-native";
export default class App extends React.Component {
state = {
data: [
{
resultlist: [
{
img:
"https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
name: "Mifa F1",
product_id: 87,
type: "product"
},
{
category_id: 20,
img: "https://www.achhacart.com/image/catalog/cmsblock/hgb5.png",
name: "Earphone",
type: "category"
},
{
img: "https://www.achhacart.com/image/catalog/cmsblock/air.gif",
name: "Air Purifier",
product_id: 87,
type: "product"
},
{
img:
"https://www.achhacart.com/image/catalog/cmsblock/Powerbank10.jpg",
name: "Powerbank",
product_id: 87,
type: "product"
}
],
sort_order: 0,
status: true,
type: "product"
},
{
img: "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
product_id: 187,
sort_order: 1,
status: true,
type: "middleimage"
},
{
resultlist: [
{
img:
"https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
name: "Mifa A1 Black",
product_id: 87,
type: "product"
},
{
category_id: 20,
img: "https://www.act.com/image/catalog/cmsblock/hgb5.png",
name: "Earphones",
type: "category"
},
{
img: "https://www.act.com/image/catalog/cmsblock/air.gif",
name: "Air Purifiers",
product_id: 87,
type: "product"
},
{
img: "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
name: "Powerbanks",
product_id: 87,
type: "product"
}
],
sort_order: 2,
status: true,
type: "product"
},
{
resultlist: [
{
image:
"https://www.act.com/simage/catalog/1AA/WeChatImage_20191228151402.jpg",
link: "",
title: "slider1"
},
{
image:
"https://www.act.com/staging-achhamall.com/image/catalog/1accc/WeChatImage_20191231125513.jpg",
link: "",
title: "slider2"
}
],
sort_order: 3,
status: true,
type: "slider"
}
]
};
render() {
let newArray = this.state.data.filter(obj => obj.resultlist);
return (
<View style={styles.container}>
{newArray.map((item, i) => (
<View>
<Text key={i} style={{color: 'red'}}>{item.type}</Text>
{item.resultlist.map((sub, index) => (
<Text key={index}>{sub.name}</Text>
))}
</View>
))}
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#ecf0f1",
padding: 8
}
});
希望这对您有所帮助.随时有疑问
Hope this helps you. Feel free for doubts