zoukankan      html  css  js  c++  java
  • vue__之路由懒加载

    1. 基础写法, 没有懒加载
    2. import Vue from 'vue'
      import Router from 'vue-router'
      import Comment from '@/assets/view/comment.vue'
      Vue.use(Router)
      
      export default new Router({
        routes: [
          {
            path: '/',
            name: 'comment',
            component: Comment
          }
        ]
      })
    3. 路由懒加载, ES6的import()方法 . (按需加载)
    4. import Vue from 'vue'
      import Router from 'vue-router'
      const HelloWorld = () => import('@/components/HelloWorld')// 写法一
      Vue.use(Router)
      export default new Router({
        routes: [
          {
            path: '/',
            name: 'HelloWorld',
            component: HelloWorld
          //或者直接方法一写在这里
         component: () => import("@/components/HelloWorld")// 写法二
          }
        ]
      })
    5. vue的异步组件, require()方法 . (按需加载)
    6. import Vue from 'vue'
      import Router from 'vue-router'
      Vue.use(Router)
      export default new Router({
        routes: [
          {
            path: '/',
            name: 'HelloWorld',
            component: resolve => require(['@/components/HelloWorld'], resolve),
          }
        ]
      })
    7. vue的异步组件 + webpack的ensure()方法
    8. import Vue from 'vue'
      import Router from 'vue-router'
      const HelloWorld = r => require.ensure([], () => r(require('@/components/HelloWorld')), 'HelloWorld')
      Vue.use(Router)
      export default new Router({
        routes: [
          {
            path: '/',
            name: 'HelloWorld',
            component: HelloWorld
          }
        ]
      })
  • 相关阅读:
    concurrent-锁
    字符串查找字符串
    指针作为函数返回值
    数组名作为函数参数
    指针和函数
    多级指针
    指针数组
    指针运算
    指针和数组
    const修饰的指针类型
  • 原文地址:https://www.cnblogs.com/cl1998/p/13205180.html
Copyright © 2011-2022 走看看