reactjs - 用嵌套的变量反应集合状态
问题描述
我有一个看起来像的输入
<input name="data.company.name" value="Bob's Burgers" />
在它的 onChange 上,我想用它的名字更新状态。
<input name="data.company.name" value="Bob's Burgers" onChange={(e) => this.setState({ [e.name]: e.target.value}) />
但是当我这样做时,状态看起来像
this.state = {
data: { company: { name: '' } },
data.company.name: "Bob's Burgers"
}
我怎样才能实现将名称传递给状态,所以我最终得到
this.state = {
data: { company: { name: "Bob's Burgers" } }
}
我无法更改输入的名称,因为它是通过字段组件设置的。
解决方案
如果您不介意将 lodash 添加到您的项目中,您可以这样做:
<input
name="data.company.name"
value="Bob's Burgers"
onChange={e =>
e.persist();
this.setState(prevState => {
return _.setWith(_.clone(prevState), e.name, e.target.value, _.clone);
});
}
/>;
推荐阅读
- android - 在 Flutter 中无法接受 android SDK 的 SDK 许可证
- c# - Read delimited record containing delimited field with varying length with FileHelpers in C#?
- c# - C# WPF Select in DataGrid the first row with pressing Enter from a Textbox
- neural-network - 神经网络:如何计算一个单元的误差
- excel - 一次导入 300 个 Excel 文件(Stata)
- java - JLabel 文本未显示,JFrame 在等待时冻结
- reactjs - 第一次调用函数后,应用程序中的状态不会改变。需要两次尝试才能改变
- amazon-ec2 - 在 AWS EC2 上加载 torch.hub.load('pytorch/fairseq', 'roberta.large.mnli') 时出错
- jquery - SwiperJS Slider 加载后变平
- java - 您如何在 JAR(背景音乐)中播放长音频剪辑?