Заполнить сборщик содержимого из массива реагировать нативно - PullRequest
0 голосов
/ 23 сентября 2018

я использую локальное хранилище (AsyncStorage) .. и хочу отобразить весь контент из локального хранилища в <Picker> .. и я создаю функцию .. функция возвращает все данные в виде массива .. это моя функция

 getElementsInLocalStorage = async () => {
        try{    
            var x = new Array();

            let all_keys = await AsyncStorage.getAllKeys();



            for(i = 0; i <= all_keys.length;i++ ){

            x[i] = await AsyncStorage.getItem('one_person'+i);

            }

            return x;
             }

        catch(error){
            alert(error);
        }
    }

и мне нужно решение, которое отображает результат, используя <Picker>

спасибо ..

1 Ответ

0 голосов
/ 23 сентября 2018

Что вам нужно сделать, это установить сохраненные данные в ваше состояние (как я это сделал в componentDidMount), если у вас есть выбранный ключ по умолчанию, просто установите его в состояние selectedKey и передайте его реквизиту selectedValue, а затем выполните итерацию по вашемуданные.

Когда выбран элемент, просто установите ключ этого элемента в своем состоянии.

Я создал для вас фрагменты кода, которые могут быть полезны:

import React, {Component} from 'react';
import {
  Picker,
  View,
  Text,
} from 'react-native';

export default class Home extends Component {
  componentDidMount() {
    this.setState({
      data: {
        key1: 'data1',
        key2: 'data2',
        key3: 'data3'
      },
      selectedKey: 'key1',
    })
  }

  render() {
    return (
        <View>
          <Picker
              selectedValue={this.state.selectedKey}
              onValueChange={key => this.setState({selectedKey: key})}>
            {
              Object.keys(this.state.data).map(key => (
                  <Picker.Item key={key} label={this.state.data[key]} value={key}/>
              ))
            }
          </Picker>
          <Text>Selected data: {this.state.selectedKey}</Text>
        </View>
    )
  }
}

ВыВы можете получить выбранное значение, используя:

this.state.data[this.state.selectedKey]
...