为什么我的React组件包装在AuthProvider中不可见

Question

我正在尝试为我的React网站创建一个React身份验证系统。 I followed this youtube tutorial.但由于某种原因，看不见包装在标签中的所有我的react组件的内容。

import React from 'react';
import '../css/App.css';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Landing from './Landing';
import Signup from './Signup';
import Login from './Login';
import Daily from './Daily';
import { AuthProvider } from '../Auth';
import PrivateRoute from '../PrivateRoute';

function App() {
  return (
    <div className="App">
      <AuthProvider>
        <Router>
            <Switch>
              <Route exact path="/" component={Landing} />
              <Route path="/signup" component={Signup} />
              <Route path="/login" component={Login} />
              <PrivateRoute path="/daily" component={Daily} />
            </Switch>
        </Router>
      </AuthProvider>
    </div>
  );
}

export default App;

请告诉我我要去哪里了。抱歉，我的问题很愚蠢，但是我是初学者。