正文
四 Vue学习 router学习
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
index.js:
按需加载组件： const login = r => require.ensure([], () => r(require('@/page/login')), 'login');
把JS文件分模块，安需加载，而不是，整个都加载。
routes ： 定义路径和组件的mapping关系。
children: 子路径的定义。
meta ： 可以格外指定一些信息。
Router ：最后定义路由的实例，并且导出，供App.vue使用。
import Vue from 'vue'
import Router from 'vue-router' Vue.use(Router) const login = r => require.ensure([], () => r(require('@/page/login')), 'login');
const manage = r => require.ensure([], () => r(require('@/page/manage')), 'manage');
const home = r => require.ensure([], () => r(require('@/page/home')), 'home');
const addShop = r => require.ensure([], () => r(require('@/page/addShop')), 'addShop');
const addGoods = r => require.ensure([], () => r(require('@/page/addGoods')), 'addGoods');
const userList = r => require.ensure([], () => r(require('@/page/userList')), 'userList');
const shopList = r => require.ensure([], () => r(require('@/page/shopList')), 'shopList');
const foodList = r => require.ensure([], () => r(require('@/page/foodList')), 'foodList');
const orderList = r => require.ensure([], () => r(require('@/page/orderList')), 'orderList');
const adminList = r => require.ensure([], () => r(require('@/page/adminList')), 'adminList');
const visitor = r => require.ensure([], () => r(require('@/page/visitor')), 'visitor');
const newMember = r => require.ensure([], () => r(require('@/page/newMember')), 'newMember');
const uploadImg = r => require.ensure([], () => r(require('@/page/uploadImg')), 'uploadImg');
const vueEdit = r => require.ensure([], () => r(require('@/page/vueEdit')), 'vueEdit');
const adminSet = r => require.ensure([], () => r(require('@/page/adminSet')), 'adminSet');
const sendMessage = r => require.ensure([], () => r(require('@/page/sendMessage')), 'sendMessage');
const explain = r => require.ensure([], () => r(require('@/page/explain')), 'explain'); const routes = [
{
path: '/',
component: login
},
{
path: '/manage',
component: manage,
name: '',
children: [{
path: '',
component: home,
meta: [],
},{
path: '/addShop',
component: addShop,
meta: ['添加数据', '添加商铺'],
},{
path: '/addGoods',
component: addGoods,
meta: ['添加数据', '添加商品'],
},{
path: '/userList',
component: userList,
meta: ['数据管理', '用户列表'],
},{
path: '/shopList',
component: shopList,
meta: ['数据管理', '商家列表'],
},{
path: '/foodList',
component: foodList,
meta: ['数据管理', '食品列表'],
},{
path: '/orderList',
component: orderList,
meta: ['数据管理', '订单列表'],
},{
path: '/adminList',
component: adminList,
meta: ['数据管理', '管理员列表'],
},{
path: '/visitor',
component: visitor,
meta: ['图表', '用户分布'],
},{
path: '/newMember',
component: newMember,
meta: ['图表', '用户数据'],
},{
path: '/uploadImg',
component: uploadImg,
meta: ['文本编辑', 'MarkDown'],
},{
path: '/vueEdit',
component: vueEdit,
meta: ['编辑', '文本编辑'],
},{
path: '/adminSet',
component: adminSet,
meta: ['设置', '管理员设置'],
},{
path: '/sendMessage',
component: sendMessage,
meta: ['设置', '发送通知'],
},{
path: '/explain',
component: explain,
meta: ['说明', '说明'],
}]
}
] export default new Router({
routes,
strict: process.env.NODE_ENV !== 'production',
})
