为什么要懒加载Vue的单页面应用访问速度通常是很快的，但是对于比较复杂的页面，第一次打开的时候会很慢。慢的原因主要有以下两个方面：1、dom元素较多，第一次打开页面时需要过多的渲染和判断，而这些渲染和判断中的大部分在打开时往往没有被消耗页面是第一次打开。2.大部分dom元素不是第一次显示，或者子组件加载时，都会调用ajax请求加载数据。这时候第一次加载的请求可能有5个、10个甚至更多。这时候，并发请求就会带来竞争。实际第一次加载可能只需要1-2个请求，耗时30ms，但是一旦并发5-10个请求，此时的体验效果就很差了。解决方案1.v-if众所周知，v-if指令在条件为false的时候是不会渲染页面的，所以这个方法确实可以用，但是如果项目比较复杂，组件太多，就写v-如果每一个，多少有些麻烦。2.子组件可以通过槽分发父组件引用子组件封装的内容。先写一个PlLazy.vue组件子组件包含参数time，是可以设置的延迟加载时间。默认为0ms，这不是必需的。接下来，父组件调用importPlLazyfrom"./plLazy";exportdefault{components:{PlLazy},name:"test-lazy"}其次，将组件嵌套在需要延迟加载的组件之上：这里是懒加载的组件/dom内容如果要用的地方比较多，那么每个页面都这样导入有点麻烦，需要公开引入组件，实现这个效果只需要在main.js中引入组件//注册全局组件importplLazyfrom"./components/common/components/plLazy";Vue.component('pl-lazy',plLazy);
