Question

我正在学习本教程：https://serverless-stack.com/chapters/create-containers.html，并且导航栏出现问题。

这是我的App.js代码：

import React, { Component } from "react";
import { Link } from "react-router-dom";
import { Navbar } from "react-bootstrap";
import Routes from "./Routes";
import "./App.css";

export default class App extends Component {
  render() {
    return (
      <div className="App container">
        <Navbar fluid collapseOnSelect>
          <Navbar.Header>
            <Navbar.Brand>
              <Link to="/">Scratch</Link>
            </Navbar.Brand>
            <Navbar.Toggle />
          </Navbar.Header>
        </Navbar>
        <Routes />
      </div>
    );
  }
}

Routes.js：

import React from "react";
import { Route, Switch } from "react-router-dom";
import Home from "./containers/Home";

export default () =>
  <Switch>
    <Route path="/" exact component={Home} />
  </Switch>;

它编译成功，但出现此错误：

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 `App`.

我注意到，如果我删除Navbar.Header部分并仅保留Navbar，那么它将起作用。

有什么想法吗？

Answer 1

本教程说您应该安装版本0.32.4-这样做了吗？当前版本doesn't have a Navbar.Header export anymore。

React JS Navbar Header元素类型无效

1 个答案: