Javascript 如何从动态列表中的特定对象更新特定字段？

我有一系列显示在列表中的对象，每个域都有一些属性：objectID/key、weight、reps。我传递给更新函数的值不是在客户端上修改过的值，而是处于我的状态的值。我如何从我的客户那里传递值

export const updateUserData=async（exerceid、日期、重量、重复）=>{
让userID=firebase.auth（）.currentUser.uid
设ref=firebase.database（）.ref（'users/'+userID+'/exercices/'+exercieid）
参考更新({
“日期”：日期，
“重量”：重量，
“代表”：代表
})。然后（（数据）=>{
console.log（'数据：'，数据）
}).catch（（错误）=>{
console.log（'错误：'，错误）
})
}

updateData（exerceid、日期、重量、重复次数）{
updateUserData（exercieid、日期、重量、重复次数）
这个文件名为readData（）
}

返回(
{Object.entries（this.state.results）.map（[key，value]）=>{
console.log（键、值）
返回(
{JSON.stringify（value.weight）}
{JSON.stringify（value.reps）}
this.updateData（key，value.date，value.weight，value.reps）}>
this.deleteData（键）}>
)
})
}
)

您需要保存状态中的更改。像

state = {
  kg: '',
  reps: '',
}

在输入中添加onChage处理程序

<TextInput onChangeText={(kg) => this.setState({kg})} style={styles.input} placeholder="Kg" keyboardType="number-pad" />

this.setState（{kg}）style={styles.input}占位符=“kg”keyboardType=“数字键盘”/>

然后在updateData函数中，从state获取这些值并更新数据

updateData(exerciceID, date) {

  const { kg, reps } = this.state;

  updateUserData(exerciceID, date, kg, reps)
  this.readData()
}

<View key={key} style={styles.listContainer}>
  <View style={styles.row}>
    <TextInput
      style={styles.input}
      placeholder="Kg"
      keyboardType="number-pad"
      onChangeText={(kg) => this.setState({kg})}
      defaultValue={JSON.stringify(value.weight)} />
    <TextInput
      style={styles.input}
      placeholder="reps"
      keyboardType="number-pad"
      onChangeText={(reps) => this.setState({ reps})}
      defaultValue={JSON.stringify(value.reps)} />
    <Button
      color="red"
      styles={styles.button}
      title="Update"
      onPress={() =>
        this.updateData(key, value.date)
      }
    />
    <Button
      color="red"
      styles={styles.button}
      title="delete"
      onPress={() => this.deleteData(key)}
    />
  </View>
</View>

updateData（exerceid，日期）{
const{kg，reps}=this.state；
updateUserData（练习ID、日期、千克、重复次数）
这个文件名为readData（）
}
this.setState（{kg}）}
defaultValue={JSON.stringify（value.weight）}/>
this.setState（{reps}）}
defaultValue={JSON.stringify（value.reps）}/>
this.updateData（key，value.date）
}
/>
this.deleteData（key）}
/>

示例组件

class Item extends React.Component {

  state = {
    kg: '',
    reps: ''
  }

  componentDidMount = () => {

    const { kg, reps } = this.props.item;

    this.setState({
      kg,
      reps,
    })
  }

  updateData = () => {...}

  render() {
    return(
      <View>
        <TextInput value={this.state.kg} onChangeText={(kg) => this.setState({kg})} ... />
        <TextInput value={this.state.reps} onChangeText={(reps) => this.setState({reps})} ... />
        <Button color="red" styles={styles.button} title="Update" onPress={() =>this.updateData(key, value.date)} />
        <Button .../>
      </View>
    )
  }
}

类项扩展React.Component{
状态={
公斤：''，
销售代表：“”
}
componentDidMount=（）=>{
const{kg，reps}=this.props.item；
这是我的国家({
公斤
代表们，
})
}
updateData=（）=>{…}
render（）{
返回(
this.setState（{kg}）}…/>
this.setState（{reps}）}…/>
this.updateData（key，value.date）}/>
)
}
}

如何编辑这些值？通过我用硬编码检查的firebase函数，我将更新代码并添加该函数。我的意思是，在客户端，按下更新按钮（视图中的第三项），以当前传递错误值。我需要恢复客户端（文本输入中）的值并将其提供给updateData（exercieid，date，weight，reps），这正是我试图避免的，因为我的列表中有多个对象，但谢谢你。这不是问题，因为你正在为每个对象传递一个键。我越来越近了，仍然有一个问题，例如，我可以编辑object1的权重和Object2的reps，在我的状态下，我会将不同对象的值混合在一起。一个解决方案是为每个对象创建一个组件，并让该组件管理每个对象的状态。我添加了一个示例组件。