我不能将状态置为常数。我在一个按钮上单击的函数中管理状态,我只会将其递增1。这很好,但是当我尝试在应用程序中的其他位置使用该状态时,会出现此错误。
我尝试过先将状态放入变量,然后再将其放入常量。
const Gallery = (
<div className={classes.Gallery}>
<Image src={images[{...this.state.imageNumber}].original} />
<button onClick={this.nextImageHandler}>
Click Me!
</button>
</div>
);
答案 0 :(得分:0)
问题是您尝试访问javascript变量的属性,而无需先检查它是否已定义。参见Detecting an undefined object property
您还没有正确索引数组,并且正在滥用散布运算符(...
)。没有理由散布数字。 ...5
没有真正的语义。
console.log({...5}); // yeilds {}
这意味着您正在尝试执行images[{}]
,并且意味着您正在尝试使用字符串[object Object]
为数组建立索引。这可能不是您的本意。您应该只做images[this.state.imageNumber]
。
关于错误Cannot read property 'original' of undefined
,我想可能是因为您从未初始化状态。结果,this.state.imageNumber
是undefined
。这意味着您正在像images[undefined]
这样索引数组。您应该做的是处理undefined
情况,或者将状态初始化为一些合理的默认值。
类似的东西:
class MyComponent extends React.Component {
state = { imageNumber: 0 };
...
render() { ... }
}
无论如何,我建议您考虑学习javascript升级课程,因为您将javascript的基础知识与reactjs混淆了,这可能使您难以调试任何一个的问题。