惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

博客园 - 三生石上(FineUI控件)
WordPress大学
WordPress大学
S
SegmentFault 最新的问题
小众软件
小众软件
T
Tailwind CSS Blog
博客园 - 聂微东
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
人人都是产品经理
人人都是产品经理
V
Visual Studio Blog
罗磊的独立博客
有赞技术团队
有赞技术团队
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
Jina AI
Jina AI
量子位
云风的 BLOG
云风的 BLOG
Recent Announcements
Recent Announcements
Hugging Face - Blog
Hugging Face - Blog
P
Proofpoint News Feed
N
Netflix TechBlog - Medium
GbyAI
GbyAI
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
腾讯CDC
美团技术团队

liaooo

Vue3自动导入常用api – liaooo Vue3自定义组件名字 – liaooo Vue+ts使用animate.css – liaooo uni-app中flyio的使用 – liaooo 【开源】查看网站在不同设备的预览效果 – liaooo Pinia的使用 – liaooo craco配置postcss不生效 – liaooo Vite配置preprocessorOptions全局引入less – liaooo 监听Pinia仓库中的数据变化 – liaooo
react-router在组件外操作路由 – liaooo
liao · 2023-07-09 · via liaooo

思路:创建可供组件外部使用的 history 对象

步骤

  1. 创建 utils/history.ts,在里面创建一个 history 对象并导出
  2. App.tsx 中使用 Router 组件来替代 BrowserRouter,并将外部 history 对象关联到 Router

utils/history.ts

import { createBrowserHistory } from 'history'

const history = createBrowserHistory()

export default history

App.tsx

import { Router, Redirect, Route } from 'react-router-dom'
import history from './utils/history'

<Router history={history}>

使用

import history from './utils/history' // 导入history对象
history.push('/home') // 跳转路由