Reactjs 设置值时如何更改React中的输入值，以及在state是数组的对象时如何更新状态？
这是我的密码Reactjs 设置值时如何更改React中的输入值，以及在state是数组的对象时如何更新状态？,reactjs,object,Reactjs,Object,这是我的密码 class Sample extends Component { constructor(props) { super(props); this.state = { editData: null, editModalOpen: false, obj: { "content": [{ "createdOn": {
class Sample extends Component {
constructor(props) {
super(props);
this.state = {
editData: null,
editModalOpen: false,
obj: {
"content": [{
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1001,
"dataFileContainerDtoList": [{
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1053,
"name": "Sheet1",
"headerDtoList": [{
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1109,
"name": "Fname",
"indexedName": "Fname",
"candidateName": null,
"custom": false
},
{
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1111,
"name": "license number",
"indexedName": "license number",
"candidateName": null,
"custom": false
}]
}, {
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1054,
"name": "Sheet2",
"headerDtoList": [{
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1113,
"name": "Fname",
"indexedName": "Fname",
"candidateName": null,
"custom": false
},{
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1115,
"name": "license number",
"indexedName": "license number",
"candidateName": null,
"custom": false
}, {
"updateOn": null,
"createdOn": {
"year": 1399,
"month": 8,
"day": 8
},
"updatedBy": null,
"createdBy": "admin",
"id": 1116,
"name": "desc",
"indexedName": "desc",
"candidateName": null,
"custom": false
}]
}]
}],
"first": true,
"numberOfElements": 13,
"size": 1000,
"number": 0
}
}
}
editFileData = (editData) => {
this.editModalOpen();
this.setState({
editData: editData
})
}
editFileDataHeaderChange = (i, j) => {
const { editData } = this.state;
this.setState({
editData: editData // How change the state of editData
})
}
editModalOpen = () => {
this.setState({
editModalOpen: true
})
}
handleEditTabChange = (event, value) => {
this.setState({
editIndexValue: value
})
}
render() {
return (
<div>
<TableBody>
{this.state.obj != null && this.state.obj.map((item) => (
<StyledTableRow key={item.id}>
<StyledTableCell align="right">
<EditIcon onClick={() => this.editFileData(item)}/>
</StyledTableCell>
</StyledTableRow>
))}
</TableBody>
<Dialog onClose={this.editFileModalClose} open={editModalOpen}>
<DialogContent dividers>
<form enctype="multipart/form-data">
<Grid container spacing={3}>
{editData !== null &&
[<Grid item xs={12} sm={12} md={12} lg={12}>
<div>
<AppBar position="static" color="default">
<Tabs
value={editIndexValue}
onChange={this.handleEditTabChange}
>
{editData.dataFileContainerDtoList.map((item, i) =>
<Tab label={editData.dataFileContainerDtoList[i].name} id={'full-width-tab-' + i} aria-controls={'full-width-tabpanel-' + i} />
)}
</Tabs>
</AppBar>
<SwipeableViews
index={editIndexValue}
onChangeIndex={this.handleChangeIndex}
>
{editData.dataFileContainerDtoList.map((item, i) =>
<TabPanel value={editIndexValue} index={i}>
{item.headerDtoList.map((item, j) =>
<TextField
onChange={this.editFileDataHeaderChange}
value={editData.dataFileContainerDtoList[i].headerDtoList[j].name}
type="text"
/>
)}
</TabPanel>
)}
</SwipeableViews>
</div>
</Grid>,
<Grid item xs={12} sm={12} md={12} lg={12} className={classNames(classes.textCenter)}>
<Button
variant="contained"
color="primary"
size="large"
onClick={this.editSubmitFileData}>
Submit
</Button>
</Grid>]}
</Grid>
</form>
</DialogContent>
</Dialog>
</div>
)
}
类示例扩展组件{
建造师（道具）{
超级（道具）；
此.state={
editData:null，
编辑：错，
obj：{
“内容”：[{
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1001，
“DataFileContainerToList”：[{
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1053，
“名称”：“表1”，
“校长名单”：[{
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1109，
“名称”：“Fname”，
“indexedName”：“Fname”，
“candidateName”：空，
“习俗”：假
},
{
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1111，
“名称”：“许可证编号”，
“indexedName”：“许可证号”，
“candidateName”：空，
“习俗”：假
}]
}, {
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1054，
“名称”：“表2”，
“校长名单”：[{
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1113，
“名称”：“Fname”，
“indexedName”：“Fname”，
“candidateName”：空，
“习俗”：假
},{
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1115，
“名称”：“许可证编号”，
“indexedName”：“许可证号”，
“candidateName”：空，
“习俗”：假
}, {
“updateOn”：null，
“createdOn”：{
“年”：1399年，
“月”：8，
“天”：8
},
“updatedBy”：空，
“createdBy”：“admin”，
“id”：1116，
“名称”：“描述”，
“indexedName”：“描述”，
“candidateName”：空，
“习俗”：假
}]
}]
}],
“第一”：对，
“numberOfElements”：13，
“尺寸”：1000，
“数字”：0
}
}
}
editFileData=（editData）=>{
这个.editModalOpen（）；
这是我的国家({
editData:editData
})
}
editFileDataHeaderChange=（i，j）=>{
const{editData}=this.state；
这是我的国家({
editData:editData//如何更改editData的状态
})
}
editModalOpen=（）=>{
这是我的国家({
editModalOpen：是的
})
}
handleEditTabChange=（事件、值）=>{
这是我的国家({
editIndexValue:值
})
}
render（）{
返回(
{this.state.obj！=null&&this.state.obj.map（（项）=>(
this.editFileData（项）}/>
))}
{editData！==null&&
[
{editData.DataFileContainerToList.map（（项，i）=>
)}
{editData.DataFileContainerToList.map（（项，i）=>
{item.headerDtoLi