元素类型无效 |反应

Question

我使用 WebStorm 作为我的环境。每次尝试在浏览器上运行应用程序时，我都会收到此错误：

<块引用>

错误：元素类型无效：应为字符串（对于内置组件）或类/函数（对于复合组件）但得到：对象。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。

这是我下面的代码。

import React from 'react';
import './App.css';
import Navbar from './components/Navbar';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
import Dashboard from './pages/dashboard';
import Deliveries from './pages/deliveries';
import Promotions from './pages/promotions';
import Inventory from './pages/inventory';
import BusinessHours from './pages/business_hours';
import BankAccount from './pages/bank_account';
import Payments from './pages/payments';
import Employees from './pages/employees';
import RequestDelivery from './pages/request_delivery';
import Support from './pages/support';

function App() {
    return (
        <>
            <Router>
                <Navbar />
                <Switch>
                    <Route path='/' exact component={Dashboard} />
                    <Route path='/deliveries' component={Deliveries} />
                    <Route path='/promotions' component={Promotions} />
                    <Route path='/inventory' component={Inventory} />
                    <Route path='/businesshours' component={BusinessHours} />
                    <Route path='/bankaccount' component={BankAccount} />
                    <Route path='/payments' component={Payments} />
                    <Route path='/employees' component={Employees} />
                    <Route path='/requestdelivery' component={RequestDelivery} />
                    <Route path='/support' component={Support} />
                </Switch>
            </Router>
        </>
    );
}

export default App;

Answer 1

检查您导出每个组件的方式。我的猜测是您没有将所有组件导出为默认值，这意味着您必须将导入的组件用大括号括起来。 另一种选择，您可能忘记将导出添加到组件中。