如何填充选择器以响应数组中的本机 [英] How to fill picker in react native from array

问题描述

我想从数组中填充选择器项..此数组存储本地存储中的数据，并且我想在选择器上显示此数据

i want to fill a picker items from array .. this array store data from local storage and i want to display this data on picker

这是我的功能从本地存储检索数据

this is my function that retrieve data from local storage

async getElementsInLocalStorage() {
 try{    
    let x = [];
    let all_keys = await AsyncStorage.getAllKeys();

    for(i = 1; i <= all_keys.length;i++ ){
        let converter =  JSON.parse(await AsyncStorage.getItem('one_person'+i));
        x[i] = converter.first_name + ' ' + converter.last_name;                  
    }

    this.setState({all_options: x, data: x,});
 } catch(error){
   alert(error)
 }
}

这是我的构造函数

constructor(){
    super();   
    this.state = {
        first_name: '',
        last_name : '',
        all_options : [],    
    };
    data = [];
}

这是我的选择器

 <Picker selectedValue = {this.state.selected} >
       {this.state.data.map((value)=><Picker.Item label={value} value={value}/>)} 
 </Picker>

仅在选择器选择器中键入 data 时填充，但键入 this.state.data
这是错误返回

when type data only in picker picker not filled but when type this.state.data this is error return

推荐答案

可以尝试一下吗？我所做的是

Can you try this. What I did is

在状态内移动数据并在执行.map

Moved data inside state and added conditional check before doing .map

constructor(){
    super();   
    this.state = {
        first_name: '',
        last_name : '',
        all_options : [], 
        data = []
    };
}

这是我的选择器

<Picker selectedValue = {this.state.selected} >
       {this.state.data && this.state.data.map(value=> (<Picker.Item label={value} value={value}/>))} 
 </Picker>

这篇关于如何填充选择器以响应数组中的本机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！