[英]React TypeError: this.state.descriptions.map is not a function
I'm trying to fix this error 我正在尝试解决此错误
What I'm trying to do is to render an automated form which is built by this function: 我正在尝试做的是呈现由该功能构建的自动表格:
let descriptionsForm = (
<form>
{this.state.descriptions.map((description, index) => (
<Input
key={index}
elementType={description.elementType}
elemenyConfig={description.elementConfig}
value={description.value}
invalid={!description.valid}
shouldValidate={description.validation}
touched={description.touched}
changed={(event) => this.descriptionInputChangedHandler(event, index)}
/>
))}
</form>
)
It works when first time opening the page, but when I tried to type something in that Input tab, the error shows up. 第一次打开页面时它可以工作,但是当我尝试在“输入”选项卡中键入内容时,会显示错误。
Here's the descriptionInputChangedHandler function: 这是descriptionInputChangedHandler函数:
descriptionInputChangedHandler = (event, index) => {
console.log("ORIGINAL: ", this.state.descriptions)
const updatedDescriptions = {
...this.state.descriptions
};
const updatedDescriptionElement = {
...updatedDescriptions[index]
};
updatedDescriptionElement.value = event.target.value;
updatedDescriptionElement.valid = this.checkValidity(updatedDescriptionElement.value, updatedDescriptionElement.validation);
updatedDescriptionElement.touched = true;
updatedDescriptions[index] = updatedDescriptionElement;
let formIsValid = true;
for (let index in updatedDescriptions) {
formIsValid = updatedDescriptions[index].valid && formIsValid;
}
console.log("UPDATED D: ", updatedDescriptions);
this.setState({descriptions: updatedDescriptions, descriptionFormIsValid: formIsValid})
}
the console.log()s looks like this, which I assume should be correct console.log()s看起来像这样,我认为应该是正确的
I imagine since the input slot was rendered properly when launching, should be something happened when updating the data, which I have no idea of. 我想由于启动时输入插槽已正确渲染,因此更新数据时应该发生了某些事情,我不知道。
Thanks for any help. 谢谢你的帮助。
ORIGINAL is an array, UPDATED D is an object. ORIGINAL是一个数组,UPDATED是一个对象。
const updatedDescriptions = {
...this.state.descriptions
};
should be: 应该:
const updatedDescriptions = [
...this.state.descriptions
];
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.