常见面试题3.0

1.vue首页白屏是什么问题引起的？如何解决呢？

vue首页加载过慢，其原因是因为它是一个单页面应用，需要将所有的资源都下载到浏览器解析

1）将公用的JS库通过script标签在index.html进行外部引入减少我们打包出来的js文件，让浏览器并行下载支援文件，提高下载速度

2）在配置路由的时候进行路由的懒加载，在调用该路由时，在加载此路由相对应的js文件加一个loading图或骨架屏，提高用户体验

3）按需加载，加载时添加loading提高用户体验

4）图片懒加载

2.vue中data的属性可以和methods中的方法同名吗？为什么

不可以，vue会把methods和data的东西，全部代理到vue生产对象中，因为执行顺序的问题，methods里面的方法会覆盖掉data里面的，最好不要同名，会产生覆盖，所以最好不要同名

3.vue3和vue2的区别

1）生命周期不同

2）双向绑定原理不同，使用proxy替换object.defineProperty,使用Proxy优势

可直接监听数组类型的数据变化

监听的目标为对象本身，不需要像object.defineProperty一样遍历每个属性，有一定的性能提升

可拦截app.ownKeys.has等13中方法，而object.definePropery不行

直接实现对象属性的新增/删除

3）vue2只有一个根节点，vue3可以有多个

4）新增Composition API更好的逻辑复用和代码组织

5）重构了Virtual DOM

模板编译时的优化，将一些静态节点编译成常量

slot优化，将slot编译为lazy函数，将slot渲染的决定权交予子组件

模板中内联事件的提取并重用

6）vue2传参props $emit vue3 props setup(props,{emit})

7)代码结构调整，更便于Tree shaking,它的体积更小

8)使用Typescript代替flow(静态类型检测工具)

9)v-for比v-if级别高