反应错误 - 元素类型无效：期望字符串（对于内置组件）或类/函数

Question

我是新手做出反应并且不理解我得到的这个错误：

这是我的菜单的渲染方法：

render() {
        return (
            <div>
                <Navbar color="faded" light expand="md">
                    <NavbarBrand href="/">Nomad Press</NavbarBrand>
                    <NavbarToggler onClick={this.toggle} />
                    <Collapse isOpen={this.state.isOpen} navbar>
                        <Nav className="ml-auto" navbar>
                            <NavItem>
                                <NavLink tag={Link} to="/Home">Home</NavLink>
                            </NavItem>
                            <NavItem>
                                <NavLink href="https://github.com/reactstrap/reactstrap">Github</NavLink>
                            </NavItem>
                            <UncontrolledDropdown nav inNavbar>
                                <DropdownToggle nav caret>
                                    Options
                                </DropdownToggle>
                                <DropdownMenu >
                                    <DropdownItem>
                                        Option 1
                                    </DropdownItem>
                                    <DropdownItem>
                                        Option 2
                                    </DropdownItem>
                                    <DropdownItem divider />
                                    <DropdownItem>
                                        Reset
                                    </DropdownItem>
                                </DropdownMenu>
                            </UncontrolledDropdown>
                        </Nav>
                    </Collapse>
                </Navbar>
            </div>
        );
    }

我仔细检查了我的导入并确保安装了这些包。我没有看到我的渲染方法有什么问题。

编辑---- 这是我的菜单导入：

import React from 'react';
import { Collapse,
    Navbar,
    NavbarToggler,
    NavbarBrand,
    Nav,
    NavItem,
    NavLink,
    UncontrolledDropdown,
    DropdownToggle,
    DropdownMenu,
    DropdownItem } from 'bootstrap';
import { Link } from 'react-router-dom';

删除Link周围的括号时出现以下错误。

Answer 1

您的渲染方法没有任何问题，但可能与您的导入有关。通常命名为导入和默认导入会导致此问题，因此

import Navbar from 'somelibrary';

vs

import {Navbar} from 'somelibrary';

所以你需要知道你正在使用的库如何导出它的组件。