Vue+webpack项目配置便于维护的目录结构教程详解

{
path: '/',
redirect: '/login'
},
{
path: '/checkrecord',
name: 'checkrecord',
component: () => import('Pages/checkrecord.vue'),
meta: {
require: true,
title: '检查记录'
}
},
{
path: '/report',
name: 'report',
component: () => import('Pages/report.vue'),
meta: {
require: true,
title: '心电图报告'
}
},
{
path: '/opinion',
name: 'opinion',
component: () => import('Pages/opinion.vue'),
meta: {
require: true,
title: '意见'
}
},
{
path: '/bind',
name: 'bind',
component: () => import('Pages/bind.vue'),
meta: {
require: true,
title: '绑定'
}
},
...common,
...doctor,
...patient,
...test
]

export default route

把所有的路由文件挂载进去。

src/service 目录

接口配置文件目录，根据页面来定义文件

同理我们只看src/service/api/index.js 和src/service/api/login.js、src/pages/login/index.vue以及页面如何调用接口即可。

src/service/api/login.js

先定义好login接口

const login = [
 {
  methodsName: 'loginByPhone',  // 方法名
  method: 'POST',
  desc: '登录',
  path: '/rest/app/login',   // 接口路径
  mockPath: '/rest/app/login',
  params: {   // 参数配置 这里需要注意，只有配置的这些参数才能通过接口，所以需要传递的参数都要在这里配置
   phone: 1,
   password: 2,
   code: 3,
   codeid: '',
   clientid: ''
  }
 },
 {
  methodsName: 'login',
  method: 'POST',
  desc: '登录',
  path: '/rest/interfacesLoginController/login',
  mockPath: '/rest/interfacesLoginController/login',
  params: {
   username: 1,
   password: 2,
   code: 3,
   codeid: '',
   clientid: ''
  }
 },
 {
  methodsName: 'checkcode',
  method: 'POST',
  desc: '验证提取码',
  path: '/rest/app/medical/checksharecode',
  mockPath: '/rest/app/medical/checksharecode',
  params: {
   sharecode: '',
   id: ''
  }
 },
 {
  methodsName: 'getCode',
  method: 'POST',
  desc: '获取验证码',
  path: '/rest/interRandomCodeController/gererateRandomCode',
  mockPath: '',
  params: {
  }
 },
 {
  methodsName: 'getPublicKey',
  method: 'POST',
  desc: '获取公钥',
  path: '/rest/interRandomCodeController/clientIdAndPublicKey',
  mockPath: '',
  params: {
  }
 }
]
export default login

src/service/api/index.js

挂载所有定义的接口文件

								 
 7/8   首页 上一页 5 6 7 8 下一页 尾页