React-dom使用JS跳转

业务中需要对数据进行一系列的操作之后才自动跳转页面，这样就不能用<Link>，需要使用JS跳转

1. 安装history

npm install --save history // 因为history被拆分了，所以需要另外安装

2. 创建一个history实例

• 新建 history.js文件，写入

import { createBrowserHistory } from 'history';

export default createBrowserHistory();

• 这里就是创建了一个history实例，之后的跳转和router的history属性都要引用

3. 给<Router>传入history

• 到<Router> 的引用文件中

import React from 'react'
// 引入Router，而不是browserRouter
import { Router} from 'react-router-dom' 
import Container from './components/container/container'
import history from './config/history' // 引入history实例

function App () {
  return <Router history={history}>  // history传参
    <Container />
  </Router>
}
export default App

4.在需要跳转功能的组件中

import React from 'react'
import history from '../config/history' // 引入history实例


async function edit (record) {
    console.log(record)
    history.push('/cost/add') // 使用push跳转
  }