Reactjs 反应组件未显示,也未给出任何错误

Reactjs 反应组件未显示,也未给出任何错误,reactjs,create-react-app,Reactjs,Create React App,我是一个新手,现在我正在制作一个带有仪表板的简单网站,我的注册和登录正在显示和工作,但我的仪表板组件根本没有显示,我也得到了0个错误。我不确定我做错了什么 App.js import React from 'react'; import Dashboard from './Components/Dashboard/Dashboard'; import Register from './Components/Auth/Register'; import Login from './Compone

我是一个新手,现在我正在制作一个带有仪表板的简单网站,我的注册和登录正在显示和工作,但我的仪表板组件根本没有显示,我也得到了0个错误。我不确定我做错了什么

App.js

import React from 'react';
import Dashboard from './Components/Dashboard/Dashboard';
import Register from './Components/Auth/Register';
import Login from './Components/Auth/Login';
import { BrowserRouter as Router, Route } from "react-router-dom";

function App() {

  return (
    <div className="Wrapper">
    <Router>
      <Route path ="/dasboard" component={Dashboard} />
      <Route exact path="/" component={Register} />
      <Route path="/login" component={Login} />
    </Router>
    </div>
  );
}

export default App;

从“React”导入React;
从“./Components/Dashboard/Dashboard”导入仪表板;
从“./Components/Auth/Register”导入寄存器;
从“./Components/Auth/Login”导入登录名;
从“react Router dom”导入{BrowserRouter as Router,Route};
函数App(){
返回(
);
}
导出默认应用程序;
Dashboard.js

import React from "react";
import "../Components CSS/Dashboard/Dashboard.css";
import "bootstrap-4-grid/css/grid.min.css";

class Dashboard extends React.Component {
  render() {
    return (
      <div className="bootstrap-wrapper">
        <div className="app-container container">
          <div className="row">
            <div className="col-xs-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
              <h1>Sales | Q4 2018</h1>
            </div>
            <div className="col-xs-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
              <button>Share</button>
              <button>Export to PDF</button>
            </div>
          </div>
          <div className="row">
            <div className="col-xs-3 col-sm-3 col-md-3 col-lg-3 col-xl-3">
              <h4>Panel Bar Container</h4>
            </div>
            <div className="col-xs-9 col-sm-9 col-md-9 col-lg-9 col-xl-9">
              <div className="row">
                <div className="col-xs-6 col-sm-6 col-md-4 col-lg-4 col-xl-4">
                  <h4>Donut Chart Container</h4>
                </div>
                <div className="col-xs-6 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                  <div className="percentage-container">
                    <span className="percentage-number">94</span>
                    <span className="percentage-sign">%</span>
                    <p>CUSTOMER SATISFACTION</p>
                  </div>
                  <div className="percentage-container">
                    <span className="percentage-number">89</span>
                    <span className="percentage-sign">%</span>
                    <p>TARGET SALES</p>
                  </div>
                </div>
                <div className="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
                  <h4>Bar Chart Container</h4>
                </div>
              </div>
              <div className="row">
                <div className="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
                  <h4>Grid Container</h4>
                </div>
              </div>
            </div>
          </div>
          <h4 style={{ display: "none" }}>Dialog Shown/Hidden with Logic</h4>
        </div>
      </div>
    );
  }
}

export default Dashboard;

从“React”导入React;
导入“./Components CSS/Dashboard/Dashboard.CSS”;
导入“bootstrap-4-grid/css/grid.min.css”;
类Dashboard扩展了React.Component{
render(){
返回(
销售| 2018年第4季度
共有
导出为PDF
板条容器
油炸圈饼容器
94
%
顾客满意度

89 % 目标销售额

条形图容器 网格容器 显示/隐藏带有逻辑的对话框 ); } } 导出默认仪表板;

在此问题上,如有任何帮助/建议,我们将不胜感激。

我想你的仪表盘拼错了

<Route path ="/dashboard" component={Dashboard} />

您可以发布文件结构的屏幕截图吗。