crmeb新建一个页面的流程

分为在原来的文件夹里面添加页面和新建一个文件夹在该文件夹里新建页面两种
1、在原来的文件夹中添加一个新的页面:

比如在product文件夹下新建一个商品保障服务的页面productGuarantee
① 首先在views目录下的product文件夹下面新建一个文件夹productGuarantee,再在该文件夹下新建一个index.vue文件

crmeb新建一个页面的流程_第1张图片

② 然后找到router文件夹下moudles下的product.js文件,在该文件下面加入你新加的页面要跳转的链接和页面地址

crmeb新建一个页面的流程_第2张图片

{
path: 'guarantee',
name: 'ProductGuarantee',
meta: {

title: '保障服务',
noCache: true

},
component: () => import('@/views/product/productGuarantee/index.vue')
}

③ 在浏览器访问:http://localhost:9528/admin/p...

crmeb新建一个页面的流程_第3张图片
在views下面添加新的文件夹,并添加新的页面,比如现在在views下面添加一个station文件夹

crmeb新建一个页面的流程_第4张图片
① 首先在views下新建station文件夹,并在station下新建notice文件夹和Index.vue文件

crmeb新建一个页面的流程_第5张图片

② 然后在router文件夹下的moudles文件夹下新建station.js,声明stationRouter然后导出

crmeb新建一个页面的流程_第6张图片

import Layout from '@/layout'
import { roterPre } from '@/settings'
const stationRouter =
{

path: `${roterPre}/station`,
name: 'station',
meta: {
  icon: '',
  title: '公告列表'
},
alwaysShow: true,
component: Layout,
children: [
  {
    path: 'notice',
    name: 'stationNotice',
    meta: {
      title: '公告列表'
    },
    component: () => import('@/views/station/notice/index')
  }
]

}
export default stationRouter

③ 在router文件夹下的Index.js中导入
crmeb新建一个页面的流程_第7张图片
④ 在页面访问:http://localhost:9528/admin/s...
crmeb新建一个页面的流程_第8张图片

如果你觉得这篇文章对你有点用的话,麻烦请给我们的开源项目点点star: http://github.crmeb.net/u/defu 不胜感激 !

你可能感兴趣的:(vue.js)