React Native Hook - Как получить данные json в State - PullRequest
Новая
       13

React Native Hook - Как получить данные json в State

1 голос
/ 10 июля 2020

Я работаю с React Native. Я получаю нужные мне отфильтрованные данные из json в «результате», но я хочу отобразить эти данные в обработчике состояния реакции, и он показывает пустой []. Я хочу, чтобы пользователь написал город, а в окне выбора были показаны возможные страны с этим городом.

Вот 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>
    ```

1 Ответ

0 голосов
/ 10 июля 2020

Вы можете решить эту проблему с помощью приведенных ниже кодов: 

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]

Или вы можете использовать другие настраиваемые функции с Country состояние

...