React Router完全不呈现组件[关闭]

Question

关闭。这个问题是off-topic。它当前不接受答案。

---

是否要改善此问题？ Update the question，因此堆栈溢出为on-topic。

关闭3分钟前。

如果我直接添加组件，组件可以很好地渲染，但是路由器不会渲染任何东西。我只是在每条路线上都有空白页，控制台中没有任何错误。

我的App.js：

import React, { Component } from 'react';
import './pages/editor'
import './css/bootstrap.min.css';
import './App.css';
import Editor from './pages/editor';
import Preview from './pages/preview';
import Home from './pages/home';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';

class App extends Component {

  render() {
    return(
      <Router>
        <div className="app-wrapper" id="App">
          <Switch>
            <Route path="/" exact componenet={Home} />
            <Route path="/editor" exact componenet={Editor} />
            <Route path="/preview" exact componenet={Preview} />
          </Switch>
        </div>
      </Router>

    )
  }

}

export default App;

除了编辑器以外，组件都是非常基本的。

preview.js：

import React, { Component } from 'react';

class Preview extends Component {
    render() {
        return(
            <div>Welcome to the preview page</div>
        )

    }
}

export default Preview;

home.js基本相同。不知道为什么它不起作用，这是我第一次使用BrowserRouter。仍在学习中，所以请多加帮助。

Answer 1

您的组件拼写不正确

<Route path="/" exact componenet={Home} />

应该是

<Route path="/" exact component={Home} />