React Native Arrays筛选问题



下面是一个示例json数据。我想根据属性字符串中的值列出水果名称。但我做不到。如果你能帮我,我会很高兴的。

[
{"Fruit":"Apple","Specifiers":["Green Peel","Red Peel","Yellow Peel","Spherical","From Trees"]},
{"Fruit":"WaterMelon","Specifiers":["Green Peel","Spherical","From Hebalecous"]},
{"Fruit":"Grape","Specifiers":["Green Peel","Red Peel","Spherical","From Semi Trees"]}
]

示例:如果我选择"来自树">我应该得到苹果

React本机代码块如下所示。我哪里做错了?

import React, { Component } from "react";
import { Text, View } from "react-native";
const Datajson = 
[
{"Fruit":"Apple",
"Specfy":["Green Peel","Red Peel","Yellow Peel","Spherical","From Trees"]
},

{"Fruit":"WaterMelon",
"Specfy":["Green Peel","Spherical","From Hebalecous"]
},

{"Fruit":"Grape",
"Specfy":["Green Peel","Red Peel","Spherical","From Semi Trees"]
}
]
class jsonArrayToList extends Component {
render() {
return (
<View>
{ /* It' ok Good Results*/
Datajson
.filter(Fruits=>Fruits.Fruit==="Grape")
.map(FilteredData=>(<View><Text>{FilteredData.Specfy}</Text></View>))

}
{ /* It's wrong Not Running*/
Datajson
.filter(Fruits=>Fruits.Specfy==="From Trees")
.map(FilteredData=>(<View><Text>{FilteredData.Fruit}</Text></View>))
}
</View>

);
}
}
export default jsonArrayToList;

问题是:如果水果名称匹配,则列出指定的。但是,如果指定匹配,则不会采用水果名称。

如何通过更改json数据结构或代码块来获得结果?感谢您的帮助从现在开始谢谢你。

Datajson.Fruit中的Specfy是一个数组,而不是像Fruit那样的文本,因此您无法像筛选常规字符串那样真正筛选它们。过滤一个数组,这是您对数组Datajson所做的操作,由Fruits.Fruit过滤。如果我理解正确的话,你的目标是在Specfy匹配时返回水果的名称?使用JavaScript的原生函数.contains()来搜索数组将是一个很好的解决方案。当数组的任何项包含传递的参数时,它返回true

...
{
Datajson
.filter(Fruits=>Fruits.Specfy.contains("From Trees")) // Will filter for any Fruit that has a `Specfy` matching "From Trees".
.map(FilteredData=>(<View><Text>{FilteredData.Fruit}</View>)
}
...

而不是使用"包含";使用";包括";

{ 
Datajson
.filter(Fruits=>Fruits.Specfy.includes("From Trees"))
.map(FilteredData=>(<p>{FilteredData.Fruit}</p>))
}

这将使苹果回归。

最新更新