React Native Hook-如何将 json 数据放入状态挂钩答案

【问题标题】：React Native Hook- How to get the json data into state hookReact Native Hook-如何将 json 数据放入状态挂钩
【发布时间】：2020-07-10 12:03:32
【问题描述】：

我正在使用 React Native。我从“结果”中的 json 获得了我需要的过滤数据，但我想将此数据显示到反应状态钩子中，它显示一个空的 []。我希望用户编写城市和选择器以显示该城市可能的国家/地区。

这是我的 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>
    ```

【问题讨论】：

标签： json react-native react-hooks

【解决方案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]

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

【讨论】：