React Error: Invalid hook call - even though syntax seems correct

Question

我为多余的 post 道歉（我知道关于这个问题的问题已经 post 编辑了多次 :/ ）。

然而，我已经经历了多次 posts，但仍然看不出是什么导致了错误。我使用的语法似乎是正确的。我曾多次尝试重写导出语句以及组件本身，但无济于事（一切都编译得很好）。我只是想使用 bootstrap 反应组件将网站页面包装在一个容器中。任何帮助将不胜感激。代码如下：

导致错误的布局组件：

import Container from 'react-bootstrap/Container';

export const Layout = (props) => (
        <Container>
            {props.children}
        </Container>    
)

App.js代码：

import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import './App.scss';
import 'bootstrap/dist/css/bootstrap.min.css';
import { Layout } from './components/Layout';
import { Home } from './Home';
import { About } from './About';
import { Work } from './Work';
import { Design } from './Design';
import { Contact } from './Contact';
import { FourOFour } from './FourOFour';



class App extends Component {
 render() {
   return (
    <React.Fragment>
      <Layout>
      
        <Router>
          <Switch>

            <Route exact path='/' component={ Home } />
            <Route path='/about' component={ About } />
            <Route path='/work' component={ Work } />
            <Route path='/design' component={ Design } />
            <Route path='/contact' component={ Contact } />
            <Route component={ FourOFour} />

          </Switch>
        </Router>
      
      </Layout>
    </React.Fragment> 
   )
 }
}

export default App;

Answer 1

如果其他人遇到此问题，请检查 json 包文件中的依赖项并确保 bootstrap-react 已在其中列出。如果不是，它将通过此错误。很容易忽略或可能安装在错误的文件夹中并认为它在那里。

React Error: Invalid hook call - even though syntax seems correct

React Error: Invalid hook call - even though syntax seems correct

reactjs

react-bootstrap