当前位置:网站首页 > Vue.js开发 > 正文

vue2.0和3.0区别面试题(vue2.0 vue3.0)



vue2采用数据劫持,结合发布者订阅者模式,通过Objec.defineProperty对数据进行拦截,设置getter,setter,当数据被访问的时候,会调用getter,vue会通知所有依赖这个数据的视图组件,当要去修改的时候,会调用setter,vue去更新所有依赖这个属性的视图组件

vue3采用proxy代理,通过对监听对象和数据的读取和写入操作从而实现数据变化的监听,实现当数据变化的时候自动更新视图

 

vue2
父:beforeCreate-Created,beforeMount
子:beforeCreate-Created,beforeMount-Mounted
父:Mounted
父:beforeUpdate
子:beforeUpdate-Updated
父:Updated
父:beforeDestory
子:beforeDestory-Destoryed
父:Destoryed
vue3
父组件的 setup() 函数和生命周期钩子会先于子组件执行。
父: onbeforeMount 和子: onbeforeMount 会同时执行。
父: onmounted 和子: onmounted 会同时执行。
父: onbeforeUpdate 和子:onbeforeUpdate 会同时执行。
父: onupdated 和子:onupdated 会同时执行。
父: onbeforeUnmount 和子:onbeforeUnmount 会同时执行。
父: onunmounted 和子:onunmounted 会同时执行。

v-model本质是语法糖,通过v-on绑定value属性,通过v-bind绑定input事件

全局守卫:‌beforeEach、‌afterEach、‌beforeResolve
组件守卫:‌beforeRouteEnter、‌beforeRouteUpdate、‌beforeRouteLeave
路由独享守卫:‌beforeEnter

vuex:采用全局单例模式,通过一个store对象来管理所有状态
pinia:采用分离式,每个组件都有自己的store实例
vuex:包含state,mutation,action,getters,module
pinia:包含id,state,getters,actions

minxs通过对象的方式组合和共享代码,hooks通过函数的方式定义逻辑和状态
minxs不能追踪数据来源和传参,hooks可以。
minxs的生命周期调用会比组件快,会存在数据被覆盖的问题

MVC:Model-View-Controller
Model:数据层
View:视图层
Controller:控制器
MVVW:Model-View-ViewModel
Model:数据层
View:视图层
ViewModel:逻辑交互层
MVVW通过ViewModel实现M和V之间的双向通信,提高代码可重用性和可维护性
MVC:是单向通信,如过要改变M需要手动操作DOM

到此这篇vue2.0和3.0区别面试题(vue2.0 vue3.0)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • 192.168.100.1随身wifi登录(192.168.100.1随身wifi登录器密码)2025-03-18 08:54:07
  • pcie5.0什么时候上市(pcie5.0 intel)2025-03-18 08:54:07
  • 安装nodemodules命令报错安装vue-loader(安装node_modules)2025-03-18 08:54:07
  • vue钩子函数执行顺序(vue钩子函数详解)2025-03-18 08:54:07
  • vue路由跳转报错(vue路由跳转报错Unexpected number)2025-03-18 08:54:07
  • vue插槽(vue插槽的理解)2025-03-18 08:54:07
  • ubuntu更换源命令(ubuntu18.04更换源)2025-03-18 08:54:07
  • 数电票纳税人端打印控件V1.6(数电票纳税人端打印控件V1.6怎么安装)2025-03-18 08:54:07
  • pcie4.0x2速度(pcie4.0速度是多少)2025-03-18 08:54:07
  • Json字符串转数组 js(json字符串转数组的方法java)2025-03-18 08:54:07
  • 全屏图片