vue组件如何通讯
此处为常用,更全更具体的,见我csnd博客
组件渲染和更新的过程
双向数据绑定v-model的实现原理
对mvvm的理解
之前《vue核心原理》里讲过,
要能对应到代码里去
Computed 有何特点
缓存,data不变则不会重新计算
提高性能
为何组件data必须是一个函数
看似是一个vue问题,实则是个js问题。为什么呢
Export default暴露出的是对象,但vue文件编译出来之后,实际是一个class类,当在某个地方使用这个组件的时候,实际是相当于对class的实例化。
实例化时执行这个data,如果不是一个函数的话,那每个组件的实例,数据都一样,都共享了。
所以总结:
1、.vue文件编译出来,实际是一个class类
2、在其他地方使用这个组件的时候,实际是相当于对class的实例化
3、函数有独立作用域,防止每个实例的数据一样
ajax请求应该放在哪个生命周期
- mounted里,之前讲过。还有个图。
- js是单线程的,ajax异步获取数据
- 放在mounted之前,只会让逻辑更混乱
如何将组件的所有props传递给子组件
答案:$props
用法:
细节知识点,优先级不高
如何自己实现v-model
Props、model、type、value、@input="$emit('对应model的event值',事件的值)"
多个组件有相同的逻辑,如何抽离
Vue2使用:mixin
但会有一点缺点。
vue3组合式API+响应式数据解决了这个问题
何时要使用异步组件
图表类大组件加载
路由异步加载
何时使用keep-alive
何时需要使用beforeDestory
- 解绑自定义事件event.$off
- 清除定时器
- 解绑自定义的dom事件,如window scroll等
用vue的事件,vue会自动解除,所以只有自定义的需要手动解除,这三者不清除的话,就容易造成内存泄漏。
什么是作用域插槽
vuex中action和mutation有何区别
- action中处理异步,mutation不可以
- mutation做原子操作,一次只干一件事
- action可以整合多个mutation
Vue-router常用的路由模式
- hash默认
- H5 history(需要服务器支持)
- 两者比较
其实还有第三种,地址不变、前进后题不可用。
追问:服务器如何支持?
如何配置vue-router异步加载
通过import导入组件
请用vnode描述一个dom结构
监听data变化的核心Api是什么
vue如何监听数组变化
- 首先object.defineProperty就不能监听数组变化
- 需要重新定义原型,重写push pop等方法,实现监听(vue核心原理里写过)
- proxy可以原生支持监听数组变化
请描述响应式原理
- 监听data变化
- 组件渲染和更新的过程
diff算法的时间复杂度
vue2在上篇文章里有详细讲解,这里只做核心差异提炼
- O(n)
- 在O(n^3)上做了调整
Tag key不相同 直接删除 ;相同,则比较。
react是仅右移的比较;vue2是双端比较,四个指针向中间靠拢;vue3是最长递增子序列。