使用 React Native Picker 显示获取的数组 [英] Using React native Picker to display fetched array

问题描述

我使用 fetch 来获取数组数据，并将它们推送到一个数组中，这样我就可以将它们显示为我的本机选择器项目，这是我的代码:

I m using fetch to get a data of arrays, and i push them into one array so i could display them as my react native picker items, this my code:

state = {
    selectedValue: '',
    data : []
   
  };
 componentDidMount() {
    
    return fetch('****url')
        .then((response) => response.json())
        .then((res) => {
            let da = [];
            var count = Object.keys(res.proches).length;
            for(var i=0;i<count;i++){
              da.push(res.proches[i][0].nom ); 
            }
            
            
            this.setState({
              data:da
            })
            
            
        })
        .done();
  }
 render() {
    console.log("!!!!!!!!!")
    console.log(this.state.data);
    return (
        <Picker
           selectedValue={this.state.selectedValue}
           onValueChange={() =>{}} >
           { this.state.data.map((item, index)=>
             <Picker.Item label={item} value={index} key={index}/>
           )}
         </Picker>

这是 console.log(this.state.data) 显示的:

and this is what console.log(this.state.data) shows:

但是我的选择器既没有显示也没有打开，我做错了什么?感谢您的回复

but my picker doesn't display anything neither open up, what have i done wrong? thanks for your replies

推荐答案

我认为这是一个样式问题.尝试给他风格:

I think it is a styling issue. try to give him style:

<Picker 
    selectedValue={this.state.selectedValue}
    style={{ height: 50, width: 100 }}
    onValueChange={(itemValue, itemIndex) => setSelectedValue(itemValue)}
>
    { 
        this.state.data.map((item, index) => <Picker.Item label={item} value={index} key={index} />)
    }
</Picker>

这篇关于使用 React Native Picker 显示获取的数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！