Javascript React native：如何基于上一屏幕上选择的数字呈现输入，并能够存储输入

我有一个屏幕，用户可以在其中选择游戏的玩家数量：

在下一个屏幕上，会出现一些文本输入，我希望能够命名玩家，以便将这些名称存储在数据库中：

我正在使用一个平面列表来生成这些字段，但似乎我不能在这里使用onChangeText。如果我尝试在任何字段中输入文本，则会出现以下错误：

代码如下：

从“React”导入React，{Component}； 从“react native”导入{视图、文本、样式表、滚动视图、图像、平面列表}； 从“../config/colors”导入颜色； 从“../components/TextField”导入{TextField}； 从“../components/PrimaryButton”导入{PrimaryButton}； 从“@react native community/async storage”导入异步存储； 类播放器\u名称\u屏幕扩展组件{ 构造器道具{ 超级作物； 此.state={ 玩家数量：[]， 播放者1:， 播放者2:， 播放者3：， 播放者4:， 播放者5:， 播放者6:， 播放者7:， 播放者8： } } componentDidMount==>{ 这个.getNumPlayers； } //这是我根据所选数量生成正确数量文本字段的糟糕方法 getNumPlayers=async=>{ let players=wait AsyncStorage.getItem'Num_players'； 这个.setState{number_players:players}； var players_json_middle=； var x； 对于x=1；x{ 回来 response.json .thenresponseJson=>{ 这个.props.navigation.navigation'round_start_screen'； }.catcherror=>{ 控制台错误； }; } 渲染{ 回来 游戏名称 球员们叫什么名字？ //在这里呈现平面列表 index.toString} /> 这个，注册} 标签=开始游戏 > ; } } const styles=StyleSheet.create{ 容器：{ 弹性：1， 对齐项目：“居中”， 背景颜色：颜色。背景颜色， 差额：10， 填充底部：5， 边框宽度：1， borderColor:colors.borderColor， }, 正文：{ 尺寸：24， 颜色：colors.primaryText， 玛金托普：10， }, 标题文字：{ 尺寸：24， 容重：“500”， 颜色：colors.primaryText， 差额：10， }, }

---

导出默认播放器名称屏幕 您尚未提供要更新的密钥。您还需要使用已更改的文本值

renderItem = ({item, index}) => {
    return (
        <TextField
            placeholder={item.Player}
            onChangeText={(newText) => this.setState({[`Player${index}`]: newText})
        />
    )
}

---

你可能想考虑使用这个状态的数组。它将使您能够在索引位置更新数组，而不是执行字符串插值。

如果您需要快速解决方案，您可以按如下所示添加开关盒

renderItem = ({item, index}) => {
        return (
            <TextField
                placeholder={item.Player}
                onChangeText={() => this._updateState(item, index)}
            />
        )
    }

_updateState = (item, index) => {
 switch(index) {
  case 0: this.setState({Player1 :item.Player}); break;
  case 1: this.setState({Player2 :item.Player}); break;
  case 2: this.setState({Player3 :item.Player}); break;
  case 3: this.setState({Player4 :item.Player}); break;
  case 4: this.setState({Player5 :item.Player}); break;
  case 5: this.setState({Player6 :item.Player}); break;
  case 6: this.setState({Player7 :item.Player}); break;
  case 7: this.setState({Player8 :item.Player}); break
 }
}

---

我不再收到错误消息，但是状态没有改变。我让它工作了。我必须向存储在num_播放器中的JSON添加一个id。但现在我知道了字符串插值。谢谢。@W.Robarts my bad，应该是索引而不是id。它由FlatList组件附加到列表项。我编辑了答案以反映这一点。Visual Studio代码在item.Player前面的冒号处出现语法错误