vue路由的异步加载(懒加载)方法

2020-01-13 21:01:04

参考链接 vue路由的异步加载(懒加载)方法

vue本身不多介绍。直接说问题,因为vue的所有路由都是加载在一个app.js里的,如果项目巨大,那么首页加载会是灾难。所以我们就需要把某些路由用异步加载(懒加载)的方式进行加载.

1.先来看正常的加载方式

import Login from "@/components/pages/signIn/signIn";export default new Router({  routes: [ {
      path: '/login',
      component: Login,
    }]
});

2.下面是第一种异步加载方法

export default new Router({  routes: [ {
      path: '/login',
      component: resolve=>require(["@/components/pages/signIn/signIn"],resolve),
    }]
});

3.下面是第二种异步加载方法(因为我们公司的项目整个就是用vue结合webpack的方式搭建的。所以这个方法直接使用是没问题的。如果只是部分的界面使用vue的,可能试一下才能确定能不能用,可能要考虑import能否支持(转化)的问题,毕竟这是ES6新特性)

export default new Router({
  routes: [ {
      path: '/login',
      component: ()=>import("@/components/pages/signIn/signIn"),
    }]
});


  • 2018-07-10 16:56:00

    MUI-图片轮播控件

    图片轮播继承自slide插件,因此其DOM结构、事件均和slide插件相同; 在MUI框架中针对图片的轮播做了一个简单的封装。

  • 2018-07-10 16:56:42

    mysql in 排序 也可以按in里面的顺序来排序

    SQL: select * from table where id IN (3,6,9,1,2,5,8,7); 这样的情况取出来后,其实,id还是按1,2,3,4,5,6,7,8,9,排序的,但如果我们真要按IN里面的顺序排序怎么办?SQL能不能完成?是否需要取回来后再foreach一下?

  • 2018-08-02 15:03:28

    正则提取字段

    如下文案,如何提取中间的文案呢 eq: 我们的%%aaa%%不一致,哈哈哈 提取后是aaa