react-router-dom v6 中的Routes

"react-router-dom": "^5.3.0",

在之前的react 项目中我们通过yarn add react-router-dom 引入react-router-dom文件

导入的文件的版本是5.3.0

然后再 这个组件中，我们这样写：

import React from 'react'
import { BrowserRouter as Router,Route,Switch } from 'react-router-dom';
import UserLogin from '@/components/UserLogin.js'
import HomeIndex from '@/components/HomeIndex.js'
import history from '@/components/History.js'


export default class App extends React.Component{
	render(){
		return (
			  
			       
				    
			        
			     
			  
		);
	}
}

 那么在项目启动之后，localhost:3000 自动的显示是UserLogin 的页面，

但是这两天我同样使用yarn add react-router-dom 引入路由的包：

自动添加的却是 react-router-dom的6.0.2的包，版本的升级导致出现了

‘Switch‘ is not exported from ‘react-router-dom‘

Switch 在新的版本中，不能用了

说是变成了Routes，于是我把代码这样调整：

import React from 'react'
import { BrowserRouter as Router,Route,Routes} from 'react-router-dom';
import history from '@/components/history/History.js'
import IndexMenu from '@/components/IndexMenu.js'
import UserLogin from '@/components/login/UserLogin.js'

export default class App extends React.Component{
	render(){
		return (
		    
			     
			      
		          
			   
		    
		);
	} 
}

我把原来代码中的Switch 换成了Routes 但是项目启动，并没有像我想的那样，页面并没有直接跳转到 UserLogin 这个组件

那里错了

				    } />
			        } />

route 标签中的内容也要做相应的修改

然后，我们启动项目，默认跳转到UserLogin 这个页面