reactjs - 无效的钩子调用导致页面崩溃

Question

我对在功能组件中做出反应和使用“react-sticky-table”有点陌生。一切似乎都很好，并且按预期工作。但是现在突然页面崩溃说。

Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

下面是我的代码。

     class Form extends Component {
                constructor(props) {
                    super(props);
                    this.state = {}
        }

        render() {                        
                return (
                    <div>
                        <div style={{ width: "100%", height: "400px" }}>
                            <StickyTable>
                                <Row>
                                    <Cell>Header 1</Cell>
                                    <Cell>Header 2</Cell>
                                </Row>
                                <Row>
                                    <Cell>Cell 1</Cell>
                                    <Cell>Cell 2</Cell>
                                </Row>
                            </StickyTable>
                        </div>
                    </div>
                );
    }
}
    
    export default connect(
        (storeState) => ({
            result: storeState.result,
        }),
        {
            resetSubmit,        
        }
    )(Form);

所以这里只有 StickyTable 会导致页面崩溃。注意：为简单起见，我截断了代码。

标签： reactjsmaterial-uireact-hooks