javascript - react Bootstrap : Element type is invalid

Question

我正在尝试使用 React Bootstrap Navbar 作为我的组件之一。但是，每当我复制代码并尝试呈现它时，都会出现以下错误:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of NewSiteNav.

我已尽我所能解决问题，我以不同的方式导入/导出组件，更新了 react、react-bootstrap 和 react -dom 但没有成功。但是，当我注释掉导航栏代码并将其替换为普通 JSX 时，它工作正常。

这是组件:

import React, { Component } from 'react';
import { Navbar, Nav, NavItem } from 'react-bootstrap';
import './NewSiteNav.css';

class NewSiteNav extends Component {

   
    render() {
       
        return (
                <div>
                    <Navbar collapseOnSelect>
                        <Navbar.Collapse>
                            <Nav defaultActiveKey="">
                                <Nav.Item>
                                    <Nav.Link href="">Active</Nav.Link>
                                </Nav.Item>
                                <Nav.Item>
                                    <Nav.Link eventKey="">Option 2</Nav.Link>
                                </Nav.Item>
                                <Nav.Item>
                                    <Nav.Link eventKey="" disabled>
                                    Disabled
                                    </Nav.Link>
                                </Nav.Item>
                            </Nav>
                        </Navbar.Collapse>
                    </Navbar>
                </div>
        )
    }
}

export default NewSiteNav;

Answer 1

请将您的导入更改为

import { Navbar, Nav } from 'react-bootstrap';

NavItem 未导出，因为它是 Nav.Item