前端路由规范

一 、 前端路由名和路径名命名规范

为避免路由重名和加强路由语义化,特制定此规范。

通常我们的项目中src目录中会有modules文件夹来拆分应用模块,如下结构

├── doctor
│   ├── pages
│   │   ├── doctor_details.vue
│   │   ├── doctor_invite.vue
│   │   └── index.vue
│   └── router
│       └── index.js

模块中会有

pages 页面组件目录

router 路由目录

router 中每个路由pathname需遵循以下规则

  • 1 path组成为 /模块名/页面名
    示例:

    {
        path: "/doctor/invite",
        component: doctorInvite,
    }
    
  • 2 name组成为 模块名[页面名]
    示例:

    {
        path: "/doctor/invite",
        name: "doctorInvite",
        component: doctorInvite,
    }
    

注意: 页面名首字母大写

二 、 前端路由跳转时使用规范

使用 router-link组件跳转路由时,需严格使用以下格式:

<router-link :to="{name:'articleAddDoctor',query:{type:0}}">

不可用 以下格式

:to="{path:'/path/to/page'}"
:to="/path/to/page"

注: 若确实有特殊情况,则允许。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容