vue考点
Vue面试中,经常会被问到的面试题/Vue知识点整理 - SegmentFault 思否
vue的双向绑定原理及实现(依赖收集实现)
compile解析模板添加watcher(给数据对象添加监听事件),watcher实例化过程中,触发observe(产生subs数据数组,get添加sub,set调用sub的notify方法【实际来自watch的update方法】)
observe函数defindpropety,get添加订阅,set更新值并出发notify
compile函数解析模板,在节点类型为元素时,遇到v-model就给input通过addeventlistener添加监听将值赋给vm,当时文本节点时,通过怎则取vm中取值返回,给元素和文本节点添加watcher订阅者
Watcher函数 实例化时(watcher初始化设置值是触发observe)往属性订阅器(dep)里面添加自己,触发notify时可以更新vm的数据
vue的diff算法
vue中是如何监听数组变化?
vue中是如何监听数组变化?_xm2by的博客-CSDN博客_vue监听数组变化
就是重写了原生push等数组方法
支持__proto__和不支持两种情况,如果浏览器支持__proto__
,则直接将当前数据的原型__proto__
指向重写后的数组方法对象arrayMethods,如果浏览器不支持__proto__
,则直接将arrayMethods上重写的方法直接定义到当前数据对象上;
eventBus
Vue组件通信中eventBus的使用 - SegmentFault 思否
vuex
可以直接用this.$store.state读取数据
为什么要使用vuex而不是window.obj来维护全局的实例属性和方法呢
1. vuex除了提供全局变量
2. 抽象业务逻辑,减少重复代码;比如异步获取的数据,不需要每个地方都写请求接口的代码,只需要store.dispatch('actionName')
3. 统一数据来源;一个数据可能来自:1.服务端 2.web socket的推送 3.响应用户操作之后对数据执行的运算符操作;没有使用vuex,你要在不同的地方写这三种其一的获取/修改数据的代码,而使用vuex只需要一句store.dispatch('actionName')要不要使用vuex
4. 便于devtool追踪调试vuex
【vue】为什么要使用vuex而不是window.obj来维护全局的实例属性和方法呢 - SegmentFault 思否
eventBus和vuex的区别
EventBus & Vuex?_weixin_34228617的博客-CSDN博客
eventbus是vue的实例,emit,on多了以后不好管理业务逻辑
vuex太大,小项目用起来不方便
slot插槽
vue中的slot与slot-scope_juse__we的博客-CSDN博客
组件
指令
vue渲染函数render的使用
vue渲染函数render的使用 - 没文化不开心的个人空间 - OSCHINA - 中文开源技术交流社区
vue修饰符
vue 各大修饰符(逐步更新)_juse__we的博客-CSDN博客
vue-router
vue $route及$router的区分_juse__we的博客-CSDN博客
前端路由简介以及vue-router实现原理
前端路由简介以及vue-router实现原理 - muwoo - 博客园
hash
后面 hash 值的变化,并不会导致浏览器向服务器发出请求,浏览器不发出请求,也就不会刷新页面。另外每次 hash 值的变化,还会触发hashchange
这个事件
history 模式
14年后,因为HTML5标准发布。多了两个 API,pushState
和 replaceState
,通过这两个 API 可以改变 url 地址且不会发送请求。同时还有popstate
事件。通过这些就能用另一种方式来实现前端路由了,但原理都是跟 hash 实现相同的。用了 HTML5 的实现,单页路由的 url 就不会多出一个#,变得更加美观。但因为没有 # 号,所以当用户刷新页面之类的操作时,浏览器还是会给服务器发送请求。为了避免出现这种情况,所以这个实现需要服务器的支持,需要把所有路由都重定向到根页面。
vue中watch,compute,methods的比较
watch,compute,methods的比较_juse__we的博客-CSDN博客
vue如何实现渲染页面,渲染过程以及原理
Vue是如何渲染页面的,渲染过程以及原理代码 - 小易的博客 - 博客园
vue渲染函数render的使用
vue渲染函数render的使用 - 没文化不开心的个人空间 - OSCHINA - 中文开源技术交流社区
vue父子组件中的生命周期与钩子函数的调用顺序(渲染顺序)
Vue.js学习(四):父子组件中的生命周期与钩子函数的调用顺序_古兮!怪哉的博客-CSDN博客_vue父子组件的生命周期顺序
vue动态加载组件
vue动态加载组件_juse__we的博客-CSDN博客_vue 动态加载组件
uniapp使用 Vue.js 开发跨平台应用的前端框架
浅谈Vue.use
关于Vue.prototype 和vue.use()的疑问
关于Vue.prototype 和vue.use()的疑问 - SegmentFault 思否
Vue中keep-alive的使用及详解
vue中keep-alive的使用及详解_半度℃温热的博客-CSDN博客_keep-alive
原理:在 created 函数调用时将需要缓存的 VNode 节点保存在 this.cache 中/在 render(页面渲染) 时,如果 VNode 的 name 符合缓存条件(可以用 include 以及 exclude 控制),则会从 this.cache 中取出之前缓存的 VNode 实例进行渲染。
Vue 属性验证
Vue 属性验证_진 찬的博客-CSDN博客_vue 属性验证
为什么用虚拟dom
缺点:首次渲染大量DOM时,由于多了一层虚拟DOM的计算,会比innerHTML插入慢。
vue中key的作用和工作原理
所以key值是在DOM树进行diff算法时候发挥作用。一个是用来判断新旧Vnode是否为同一个,从而进行下一步的比较以及渲染。另外一个作用就是判断组件是否可以复用,是否需要重新渲染。
vue高级api
vue高级用法_弹琴弹琴的博客-CSDN博客_vue 高级写法