vue遗漏知识点

vue 相关知识点

1. $attrs和$listeners 二次封装组件

当我们对第三方组件进行二次封装，但是不想重写组件上原有的属性 可以使用 v-bind="$attrs"

例如 
	封装的第三方组件：<template><div><el-button v-bind="$attrs">确定</el-button></div></template>
	使用封装的第三方组件: <my-button type="parmery" size="mini"></my-button>

2. render 函数 render 函数封装createElement 可以在组件使用render 函数

例如 render :function(createElement){return
createElement(‘div’,{class:{child:true,more:true},attr:{},style:{}})}

3.长列表优化性能

通过Object.freeze() 数据冻结

4.不建议使用index作为列表渲染的key 因为如果用index作为key 数组的顺序颠倒index都是0，1，2，3 导致vue复用旧的节点
5.使用keep-alive 缓存组件 当组件被激活的时候调用的生命周期是activited 当组件被销毁的生命周期是deactivited
6.组件中的data为什么是一个函数？

因为组件是用来复用的，组件data他是一个对象，可以维护一份被返回对象的独立拷贝，组件件的data属性值互相不影响

7.vue 优化方案

1.使用路由懒加载 component:()=>import (’@view/xx.vue’)
2.使用cdn加速
3.nginx的gzip压缩
4.按需加载引用第三方ui组件
5.loading