首页 > 其他分享 >ReactRouter-路由模式

ReactRouter-路由模式

时间:2022-12-06 02:11:16浏览次数:37  
标签:BrowserRouter ReactRouter 模式 HashRouter import 路由

路由模式

  • BrowserRouter与HashRouter
    • BrowserRouter 没有#的路径
    • HashRouter 有#路径
举个栗子
import React from 'react'
import { BrowserRouter, HashRouter, Redirect, Route, Switch } from 'react-router-dom'

export default function App() {
  return (
  	<BrowserRouter> //BrowserRouter路由模式  可以更换 HashRouter模式
            <Switch>
            	<Route></Route>
            </Switch>
        </BrowserRouter>
  )
}

标签:BrowserRouter,ReactRouter,模式,HashRouter,import,路由
From: https://www.cnblogs.com/bingquan1/p/16954092.html

相关文章

  • ReactRouter-参数传递与获取参数
    参数传递与获取参数1.动态路由传参*前提配置路由,留好占位//1.配置占位<HashRouter><Switch><Routepath="/xxx/:id"></Route>//留好占位</Switch><......
  • 单例模式
    单例模式提供了一种创建对象的最佳方式这种模式涉及到一个单一的类,该类负责创建自己的对象,同时确保只有单个对象被创建.这个类提供类一种访问唯一对象的方式,......
  • Selenium4+Python3系列(十一) - Page Factory设计模式
    写在前面:PageObject模式,目的是将元素定位和元素操作分层,只接触测试内容,不写基础内容,便于后续对自动化测试用例体系的维护,这是中心思想,也是核心。那么我们继续将简洁延续,......
  • VMware WorkStation NAT模式配置
    vmwareworkstation17下载地址 ​​https://download3.vmware.com/software/WKST-1700-WIN/VMware-workstation-full-17.0.0-20800274.exe​1.检查Linux虚拟机的网络连接......
  • Selenium4+Python3系列(十一) - Page Factory设计模式
    写在前面:PageObject模式,目的是将元素定位和元素操作分层,只接触测试内容,不写基础内容,便于后续对自动化测试用例体系的维护,这是中心思想,也是核心。那么我们继续将简洁延续......
  • 07.桥接模式
    桥接模式将抽象部分与实现部分分离,使它们都可以独立的变化定义接口和抽象类namespace桥接模式{//实现接口publicinterfaceIDraw{voidD......
  • Redis的三种模式
    一、Redis模式Redis有三种模式:分别是主从同步/复制、哨兵模式、Cluster主从复制:主从复制是高可用Redis的基础,哨兵和群集都是在主从复制基础上实现高可用的。主从复制主要......
  • Redis的三种模式
    一、redis主从复制1、主从复制-哨兵-集群主从复制:主从复制是高可用Redis的基础,哨兵和集群都是在主从复制基础上实现高可用的。主从复制主要实现了数据的多机备份,以及对于......
  • vue实现路由懒加载
    1、安装插件@babel/plugin-syntax-dynamic-importnpminstall–-save-dev@babel/plugin-syntax-dynamic-import2、安装完成之后,打开babel.config.js文件,将@babel/p......
  • 设计模式简单总结
    UML例子该例子主要有继承关系,实现接口关系,依赖关系,组合(合成)关系,关联关系。UML中接口的两种表示方法:简单工厂模式如果只有计算父类和具体的加减乘除子类就已经满足封......