react 一级路由封装全过程

最新推荐文章于 2023-06-05 19:53:11 发布

°猫狸.

最新推荐文章于 2023-06-05 19:53:11 发布

阅读量220

点赞数

文章标签： react.js 前端 javascript Powered by 金山文档

本文链接：https://blog.csdn.net/moajiu/article/details/128892384

版权

本文详细介绍了如何在React项目中进行一级路由的封装过程，包括在router文件夹下创建routeConfig.js配置路由，将路由导入app.js，封装RouterView组件，并在app.js中使用，最后展示RouterView组件的完整代码。

摘要由CSDN通过智能技术生成

1.在路由router文件夹下创建一个路由.js 例如：routeConfig.js

配置并导出：

var Index = lazy(()=>import('./views/Index'))   //首页
var Login = lazy(()=>import('./views/Login'))  // 登录页
var Register = lazy(()=>import('./views/Register'))  //注册
var NotFound = lazy(()=>import('./views/NotFound'))  //404页面
// 整个项目的路由表 
export default[
    {
        path:'/index',
        component:Index,
        expect:false
    },
    {
        path:'/login',
        component:Login,
        expect:false
    },
    {
        path:'/register',
        component:Register,
        expect:false
    },
    {
        from:'/',
        to:'/index',
        isRedirect:true,
        expect:false

    },