2022-09-11 面试题:vue(三) vue组件初次渲染和更新的过程,vue页面之间是如何传值的,为什么做首屏优化以及如何做首屏优化

1.描述一下vue组件渲染和更新的过程

回答:

vue组件初次渲染的过程

解析模板为render函数,
触发响应式,监听data属性的getter和setter
执行render函数,生成vnode.patch(elem,vnode)

vue组件更新的过程

修改data,触发setter(此前在getter中已被监听),
重新执行render函数生成newVnode,patch(vnode,newVnode)

2.什么是组件?为何要封装组件?

回答:

封装组件的好处

为代码解耦,提高代码的复用率

组件的定义

页面上可以复用的都称为组件,它是HTML,CSS,JS的聚合体
组件相当于库,把一些能在项目中复用的代码进行需求性封装

3.vue页面组件之间是如何传值的?

回答:

• 使用vue-router通过跳转链接带参数传参
• 使用本地缓存localStorage
• 使用vuex数据管理传值

4.computed,watch和methods的区别是什么?

• methods:只要发生重新渲染,methods调用总会执行该函数
• computed:计算属性是基于它们的依赖进行缓存的,只有在它的相关依赖发生改变时才会重新求值
• watch:用于观察和监听页面上的vue实例,使用场景:在数据变化的同时进行异步操作,或是比较大的开销,