vue 如何使用插件？Vue 组件懒加载，图片懒加载

　　vue 如何使用插件

　　直接安装，引入就能使用。vue 还是 js，只要是 js 那么所有的插件使用都是相同的方式，引入绑定到对应的节点或者操作对应的节点就好。

　　Vue 组件懒加载，图片懒加载

　　组件懒加载

　　1. 结合路由插件使用的时候使用 import 方式实现

　　// 第一步注释import导入的文件

　　// import About from '../components/About.vue';

　　// 第二步将引入组件的方式以箭头函数的方式异步引入

　　const routes = [

　　{

　　path: '/about'，

　　component: () => import( /* webpackChunkName: 'about' */ '../components/About.vue' )

　　}

　　]

　　````

　　2. 引入组件的时候使用回调函数的方式引入，比如

　　```js

　　// 组件懒加载

　　const IconList = () => import('components/base/icon-list');

　　export default {

　　components: {

　　IconList,

　　},

　　};

　　````

　　图片懒加载

　　就是在加载页面的时候，如果页面中的图片过多，可以使用占位符的方式替换没有在可是区域内的图片，只加载当前需要现实的图片。监听滚动条的位置，当图片标签出现在可视区域的时候，重置图片的路径为真是路径，然后展示图片地址。一般在实际开发的时候都直接使用图片懒加载插件实现。还有一种解决方案就是使用页面骨架屏效果，也是类似占位显示，当数据加载完成之后替换掉占位显示的内容。