通过使用API 获取的数据,React Native中未填充选择器项目

问题描述 投票:0回答:1

[在您说这是一个重复的问题之前,这是3年前提出的问题的link,他们讨论了如何使用数组和列表填充下拉列表。

我正在使用map,这是ES6的JS中引入的数据结构。

我在下拉菜单中使用Picker。

我正在用REST API提取的数据填充名为branchData的地图。

这是我用于填充下拉菜单的代码:

<Picker
            selectedValue={this.state.branch}
            style={styles.fieldPicker}
            mode="dropdown"

            onValueChange={(itemValue, itemIndex) =>
              this.setState({branch: itemValue})
            }>

            {/* Data Binding */}

                {this.state.branchData.forEach((name, id) => 
                      {
                      return <Picker.Item key={id} value={id} label={name} />;
                      })
                }



          </Picker>

我通过单击按钮登录来检查名称和ID是否正确访问。问题是我看不到下拉列表被填充,我所看到的只是向下的敲击,什么也没做。之前,我手动添加了两个选择器项,并且在点击时可以看到它们。

UPDATE:

问题是在API可以获取详细信息并更新状态变量之前调用了render函数。

因此,下拉列表为空,但在按下时调用的console.log显示数据

javascript react-native dictionary ecmascript-6 picker
1个回答
0
投票

更新:

我认为这是因为在api调用和状态更新之前调用了render。

我已经在构造函数中添加了API调用,假设它会在渲染之前执行,但是API调用是异步的,不会在渲染之前发生。

现在,我计划在API调用后在.then块内调用render,希望它会有所帮助,很快就会更新。

© www.soinside.com 2019 - 2024. All rights reserved.