Какой компонент я пропустил для экспорта?Неверный тип ошибки ... ошибка - PullRequest
0 голосов
/ 15 февраля 2019

Я уверен, что я экспортировал все свои компоненты, но все еще получаю одну и ту же ошибку:

Тип элемента недопустим: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов)) но получил: undefined.Вы, вероятно, забыли экспортировать свой компонент из файла, в котором он определен, или вы могли смешать импорт по умолчанию и с именами.Проверьте метод визуализации CustomNavbar.

App.js

import React, { Component } from 'react';
import './App.css';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import Home from './Home.js';
import Navbar from './CustomNavbar.js';


class App extends Component {
  render() {
    return (
      <Router>
        <div>
          <Navbar />
          <Route exact path="/" component={Home} />
        </div>
      </Router>
    );
  }
}

export default App;

CustomNavbar.js

import React, { Component } from 'react'
import { Navbar, Nav, NavItem } from 'react-bootstrap';
import { Link } from 'react-router-dom';

export default class CustomNavbar extends Component {
    render() {
        return (
            <Navbar default collapseOnSelect>
            <Navbar.Header>
                <Navbar.Brand>
                    <Link to="/">My Page</Link>
                </Navbar.Brand>
                <Navbar.Toggle />
            </Navbar.Header>
            <Navbar.Collapse>
                <Nav pullRight>
                <NavItem eventKey={1} componentClass={Link} to="/">
                    Home
                </NavItem>
                </Nav>
            </Navbar.Collapse>
            </Navbar>
        )
    }
}

Home.js

import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import { Jumbotron, Button } from 'react-bootstrap';

export default class Home extends Component {
    render() {
        return(
            <div>
            <Jumbotron>
                <h1>Hello, this is my page</h1>
            </Jumbotron>
            <Link to="/about">
            <Button bsStyle="primary">About</Button>
            </Link>
            </div>

        )
    }
}

1 Ответ

0 голосов
/ 15 февраля 2019

Изменить

import Navbar from './CustomNavbar.js';

на

import CustomNavbar from './CustomNavbar.js';

И

Изменить

  <Navbar />

На

  <CustomNavbar />

В App.js

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...