Prototype 原型对象​

Prototype 翻译过来叫“原型”，原型是一种在开发生命周期的早期显示应用程序或产品的外观和行为的模型。Javascript 中的 prototype 叫原型对象，是每一个函数都有的属性。

src 就是 source 的简写，source 意为资源，当你使用<img src="xxx" />时，src 就将该资源下载并嵌入这个标签。

href 的 ref 也就是 reference，意为引用、涉及，当你使用<a href="xxx" />时，href 表示该标签指向了xxx，或者说xxx被该标签引用了。这是一种关系的描述，当你点击了这个标签，浏览器知道：“哦，你点击的这个标签指向了xxx，我这就跳转到这个地址！”

非常简单的路由拦截，使用localstorage储存登录状态，写一个拦截组件，由他根据登录状态来判断是否跳转到登录。

一个很常见的需求：有些路由，需要登录才能访问，不登陆的情况下访问它就跳转到登录页面。这里就用 Context 来写个路由鉴权的小例子。

react-router v6稳定版出来了，有许多改变，以前拦截路由的方式也用不成了。在世界之外遨游了好久终于找到了一篇文章，学废了！整理学习一下分享出来。

安装react-router-dom的时候版本已经变成6.0.2了，没注意到，结果在写项目时候怪怪的，以往的写法都不对了，照着仓库的例子学了学发现跳转时闪屏。

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import {HashRouter,Route, Routes } from 'react-router-dom';
import User from './pages/User/User';
import Main from './pages/Main/Main'

ReactDOM.render(
  <React.StrictMode>
    <HashRouter>
      <Routes>
        <Route path="/" element={<App />}>
          <Route path="user" element={<User />}/>
          <Route path="*" element={<Main />}/>
        </Route>
      </Routes>
    </HashRouter>
  </React.StrictMode>,
  document.getElementById('root')
);

官方仓库的教程只写了 <Router></Router>，虽然比#号看起来舒服，但是一跳转就闪。

使用 <HashRouter></HashRouter> 就不闪屏了。