Javascript 从JSON动态响应中的状态管理
我有一个这样的动态表单模板:Javascript 从JSON动态响应中的状态管理,javascript,reactjs,object,react-state-management,Javascript,Reactjs,Object,React State Management,我有一个这样的动态表单模板: 类betClient扩展组件( 状态={ ............. } ................ const ServerConfigDetails=this.state.ServerConfigDetail.map(字段=>{ let SecretFields=“access_token”| |“api_token”| |“private_token”| |“password”| |“security_token”| |“client_secret”|“
类betClient扩展组件(
状态={
.............
}
................
const ServerConfigDetails=this.state.ServerConfigDetail.map(字段=>{
let SecretFields=“access_token”| |“api_token”| |“private_token”| |“password”| |“security_token”| |“client_secret”|“refresh|u token”|“oauth|client|id”| |“oauth| client| secret”| |“developer|”
如果(field.name==SecretFields){
返回
}
如果(field.name==“开始日期”){
返回
}
如果(field.name==“结束日期”){
返回
}
//在这里,我们为所有其他非日期或机密字段的字段设置模板
if(field.name!==SecretFields){
返回
}
})
render(){
返回(
{ServerConfigDetails}
)
}
)
一切都很好,表单是动态呈现的,但不知何故,我不知道如何更好地将表单输入作为对象放入状态,而不必在初始状态中单独声明每个字段。有什么帮助吗
不确定这是否足够清楚,但我很乐意提供任何额外的信息。我首先建议,我们应该决定我们的州会是什么样子-
{
选择:{
//使用具有默认值的单个键
},
动态:{}//首先没有键值对
}
然后让所有组件都受控——通过传递值prop(最后传递到本地输入)来控制要设置的内容
const{selects,dynamic}=this.state;
//按选择传递值。还是空字符串
最后,为select和dynamicinput字段组件添加onChange处理程序。(并最终传递到本地输入)
onChangeSelectField(事件,字段名){}
//输入字段也一样
这些处理程序将处理状态,以便在不存在事件目标值的情况下添加键;如果输入新值,则添加替换(覆盖)当前键值
{
const currentDynamicData=this.state.dynamic;
const newData={…currentDynamicData,{…updatedata};//updatedata是较新的键值对
this.setState({dynamic:newData});
}
这是一个很好的解决办法。这能回答你的问题吗@RandyCasburn,不,不完全是,我知道这个选择,但在我们的情况下,这将很难管理。我想知道我是否可以在不手动创建每个字段作为键的状态对象的情况下获取表单数据-总共64个可能的字段可以随机匹配以创建单个表单。那他就是你的朋友了。其中一些可能也有帮助:——--