React Native Hook-如何将json数据放入状态钩子

Question

我正在使用React Native。我从json中获得我需要的过滤数据；结果"；但我想把这个数据显示到一个react状态钩子中，它显示一个空[]。我希望用户编写城市，并选择显示该城市的可能国家。

---

这里是mi JSON

```
data:[
{
"id": 1704127,
"name": "Madridejos",
"state": "",
"country": "PH",
"coord": {
"lon": 123.346199,
"lat": 9.79116
}
},
{
"id": 1704129,
"name": "Madrid",
"state": "",
"country": "PH",
"coord": {
"lon": 125.964371,
"lat": 9.26211
}
},
]
```

这是我的代码：

```

const [value, setValue] = useState('')
const [country, setCountry] = useState('')
const [state,setState]=useState()
var result



const handleChange=(event)=>{
setValue(event.target.value)
if (event.target.value && event.target.value.length > 0) {
conuntries(event.target.value)
} else {
setState({})
}

}
const conuntries=(city)=>{
const finalCity=
city.charAt(0).toUpperCase() + city.slice(1)
result=
data.filter(d => d.name===finalCity)
console.log('result', result)
setState(result)
console.log(state)

}

<View className="form-group">
<TextInput placeholder='City' onChange={handleChange}value={value}

name='city' type='text' className="form-control" />
</View>
<View className="form-group">`enter code here`
<Picker
selectedValue={country}
onValueChange={(itemValue, itemIndex) => setCountry(itemValue)}
>

{state&& state.map(a => (
<Picker.Item  key={`search-a-${a.id}`}style={styles.picker}label={a.country} value={a.country} />))}


</Picker>

</View>
```

Answer 1

您可以通过以下代码解决：

const [country, setCountry] = useState('')
const handleChange=(event)=>{
if (event.target.value && event.target.value.length > 1) {
conuntries(event.target.value)
}
}
const conuntries=(city)=>{
const finalCity= city.charAt(0).toUpperCase() + city.slice(1).toLowerCase();
let result = data.filter(d => d.name===finalCity)
if(result.length !== 0){
setCountry(result)
console.log(country)
}

}

如果你只想得到一个国家，假设可以有来自不同国家的多个同名城市，那么你可以使用得到第一个

let result = data.filter(d => d.name===finalCity)[0]

或最后一个

let result = data.filter(d => d.name===finalCity)
result = result[result.length -1]

或者您可以使用国家状态的其他自定义功能