react路由如何安装

import{HashRouterasRouter,Route,NavLink}from'react-router-dom'

functionApp(){
return(

//exact精确匹配
首页|
关于

{/*路由页面*/}




)
}
exportdefaultApp

functionHome(){
return
首页页面
}

functionAbout(){
return

关于页面

}

import{HashRouterasRouter,Route,NavLink,Redirect,Switch,Prompt,Link}from'react-router-dom'
//NavLink会比link自动添加一个active的class
functionApp(){
return(

首页|
关于
产品abc
产品123

{/*路由页面*/}





)
}
exportdefaultApp

functionProduce({match,history,location}){
//console.log(match);
return(

产品{match.params.id}
history.goBack()}>返回
history.push('/')}>回到首页
)
}

functionHome(){
return
首页页面
}

functionAbout(){
return
关于页面

}

//导入路由相关组件
//导入哈希路由别名router
//Route路由页面
//NvaLink导航链接
import{HashRouterasRouter,Route,NavLink,Redirect,Switch,Prompt,Link}from'react-router-dom'
//NavLink会比link自动添加一个active的class
functionApp(){
return(

首页|
关于
产品abc
产品123
管理

{/*路由页面*/}






)
}
exportdefaultApp
functionNoMatch({location,history}){
return(

404
你爹来咯
{location.url}
后退
首页

)
}
functionAdmin(){
return(


概览

列表






)
}
functionDash(){
return(

概览
)
}
functionOrderList(){
return(

订单列表
)
}
functionProduce({match,history,location}){
//console.log(match);
return(

产品{match.params.id}
history.goBack()}>返回
history.push('/')}>回到首页
)
}

functionHome(){
return
首页页面
}

functionAbout(){
return
关于页面

}