我得到这个错误是因为我不小心在我的渲染方法中调用了一些方法。由于我的应用程序代码真的很大,我无法找出这是从哪里来的。
当我单击控制台中的index.js链接时,它会将我带到以下代码。
这是我在做了一些调试(调用堆栈)之后发现的,但它并不是完整的组件代码,因为组件中有太多的代码行,我只是在这里发布它的一部分。这段代码有什么问题吗:
class Sample extends React.Component {
constructor(props) {
super(props);
this.handleSelect = this.handleSelect.bind(this);
this.state = {
activeKey: '',
};
}
handleSelect(activeKey) {
this.setState({ activeKey });
}
render() {
if (this.state.activeKey === '') {
activeKey = this.getDefaultKey();
this.handleSelect(activeKey);
}
return (
<PanelGroup
accordion
activeKey={this.state.activeKey}
onSelect={this.handleSelect}
>
{optionList}
</PanelGroup>
);
}
}
发布于 2018-08-15 05:13:49
我会首先使用react dev tools chrome扩展,如果你使用的是redux,你也可以安装redux开发工具,这两个工具都可以发现状态或属性中的错误。
不过,最有可能的情况是,您的某个组件中存在错误,您应该使用代码片段或代码库链接来更新您的问题。
发布于 2018-08-15 13:21:14
您将在render函数中调用this.handleSelect,该函数调用setState。正如错误所说,您不能这样做。在没有看到整个组件并知道它应该做什么的情况下,我不能确定,但我最好的猜测是至少不会出错:
class SampleOptions extends React.Component {
constructor(props, context) {
super(props, context);
this.handleSelect = this.handleSelect.bind(this);
this.state = {
activeKey: this.getDefaultKey(),
};
}
handleSelect(activeKey) {
this.setState({ activeKey });
}
render() {
return (
<PanelGroup
accordion
activeKey={this.state.activeKey}
onSelect={this.handleSelect}
>
{optionList}
</PanelGroup>
);
}
}
https://stackoverflow.com/questions/51849734
复制相似问题