ReactDOM.render, выдающий тип элемента ошибки, недопустим - PullRequest
0 голосов
/ 20 ноября 2018

Я пытаюсь использовать React router для отображения правильной страницы на основе URL-адреса, основных вещей. Единственная проблема в том, что я получаю сообщение об ошибке, которого я никогда раньше не видел. Вот оно:

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

Проверьте метод рендеринга Home.

Не уверен, почему я это вижу. Надеюсь, вы все сможете увидеть то, что мне не хватает. Вот пример кода для моего index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { BrowserRouter as Router } from "react-router-dom";

function doRender() {

    ReactDOM.render(
        <Router>
            <div>
                <App/>
            </div>
        </Router>, document.getElementById('root'));
}

doRender();

serviceWorker.unregister();

А вот и App.js:

import React, { Component } from 'react';
import './App.css';
import { Route } from 'react-router-dom';
import Home from './Components/Home';


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

export default App;

И, наконец, вот код для домашней страницы:

import React, { Component } from 'react';
import '../index.css';
import MenuBar from '../SubComponents/MenuBar';
import bgVideo from '../Media/bg-video.mp4';

class Home extends Component {
    render() {
        return (
            <div className="App">
                <div className='MenuBar'>
                    <MenuBar/>
                </div>
                <div className="bg-video">
                    <video loop autoPlay>
                        <source src={bgVideo} type="video/mp4"/>
                    </video>
                </div>
            </div>
        );
    }
}

export default Home;

Заранее спасибо за вашу помощь!

...