rpx、px、em、rem、%、vh、vw的区别是什么？
- rpx 相当于把屏幕宽度分为750份，1份就是1rpx
- px 绝对单位，页面按精确像素展示
- em 相对单位，相对于它的父节点字体进行计算
- rem 相对单位，相对根节点html的字体大小来计算
- % 一般来说就是相对于父元素
- vh 视窗高度，1vh等于视窗高度的1%
- vw 视窗宽度，1vw等于视窗宽度的1%
.vue,小程序,uni-app的生命周期
1. beforeCreate（创建前）
2. created（创建后）
3. beforeMount(载入前),（挂载）
4. mounted（载入后）
5. beforeUpdate（更新前）
6. updated（更新后）
7. beforeDestroy（销毁前）
8. destroyed（销毁后）vue 的生命周期
1.beforeCreate
在实例创建之间执行，数据是未加载状态。
创建一个Vue实例，此时实例上只有一些生命周期函数和默认的事件
此时data computed watch methods上的方法和数据均不能访问
2.created
在实例创建、数据加载后，能初始化数据，DOM渲染之前执行。
可以对data数据进行操作，可进行一些请求，请求不易过多，避免白屏时间太长。
3.beforeMount
虚拟DOM已创建完成，在数据渲染前最后一次更改数据。el未挂载。
判断el的挂载方式
判断是否有template设置
将template进行渲染保存到内存当中，还未挂载在页面上
4.mounted
页面、数据渲染完成。el挂载完毕。可以访问DOM节点。
将内存中的模版挂载到页面上
此时可以操作页面上的DOM节点
此时组件从创建阶段进入运行阶段
5.beforeUpdate
重新渲染之前触发。不会造成重渲染。
页面显示的数据是旧的，此时data里面的数据是最新，页面数据和data数据暂未同步6.updated
数据已经更新完成，DOM也重新render完成，更改数据会陷入死循环。
根据data里的最新数据渲染出最新的DOM树，然后将最新的DOM挂载到页面
此时data和页面数据一致，都是最新的
7.beforeDestroy
实例销毁前执行，实例仍然完全可用。
此时组件从运行阶段进入到销毁阶段
组件上的data和methods以及过滤器等都出于可用状态，销毁还未执行
8.Destroyed
实例销毁后执行，这时候只剩下DOM空壳。
组件已经被完全销毁，组件中所有的数据、方法、指令、过滤器等，都已不可用
简述MVVM 和MVC的原理以及区别？
MVVM视图模型双向绑定，是Model-View-ViewModel的缩写
1、MVVM的优点：
低耦合。视图（View）可以独立于Model变化和修改，一个Model可以绑定到不同的View上，当View变化的时候Model可以不变化，当Model变化的时候View也可以不变；
可重用性。你可以把一些视图逻辑放在一个Model里面，让很多View重用这段视图逻辑。
独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel)，设计人员可以专注于页面设计。
可测试
Model（模型）表示应用程序核心（如数据库）。
View（视图）显示效果（HTML页面）。
Controller（控制器）处理输入（业务逻辑）。
MVC 模式同时提供了对 HTML、CSS 和 JavaScript 的完全控制。
Model（模型）是应用程序中用于处理应用程序数据逻辑的部分。（通常模型对象负责在数据库中存取数据)
View（视图）是应用程序中处理数据显示的部分。(通常视图是依据模型数据创建的)
Controller（控制器）是应用程序中处理用户交互的部分。(通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据）
优点:
1、低耦合
2、重用性高
3、生命周期成本低
4、部署快
5、可维护性高
6、有利软件工程化管理
3、MVC与MVVM的区别？
MVC和MVVM的区别并不是VM完全取代了C，ViewModel存在目的在于抽离Controller中展示的业务逻辑，而不是替代Controller，其它视图操作业务等还是应该放在Controller中实现。也就是说MVVM实现的是业务逻辑组件的重用。
MVC中Controller演变成MVVM中的ViewModel
MVVM通过数据来显示视图层而不是节点操作
MVVM主要解决了MVC中大量的dom操作使页面渲染性能降低,加载速度变慢,影响用户体验
vue中的data为什么是一个函数？起到什么作用？
在Vue组件中，data选项必须是一个函数，而不能直接是一个对象。这是因为Vue组件可以同时存在多个实例，如果直接使用对象形式的data选项，那么所有的实例将会共享同一个data对象，这样就会造成数据互相干扰的问题。
因此，将data选项设置为函数可以让每个实例都拥有自己独立的data对象。当组件被创建多次时，每个实例都会调用该函数并返回一个新的data对象，从而保证了数据的隔离性。
另外，data选项作为一个函数还具有一个重要的特性，就是它可以接收一个参数，这个参数是组件实例本身。这个特性在一些场景下非常有用，例如在定义组件时需要使用组件实例的一些属性或方法来计算初始数据。
因此，为了避免数据共享和保证数据隔离性，以及方便使用组件实例的属性和方法，Vue组件中的data选项必须是一个函数。
vue中ref的作用？
1、获取DOM元素的引用。
ref 加在普通的元素上，用this.ref.name 获取到的是dom元素
vue给我们提供一个操作dom的属性，ref绑定在dom元素上时，用起来与id差不多，通过this.$refs来调用
2、获取子组件的引用。
在Vue组件中使用ref可以获取子组件的引用，从而可以在父组件内部调用子组件的方法或访问其数据。
在父组件中将子组件引入，并在子组件标签上添加ref属性，然后就可以通过this.$refs.myChild获取子组件的引用，在父组件内部调用子组件的sayHello方法。
注意事项：
ref 需要在dom渲染完成后应用，在使用时确保dom已经渲染完成。比如在生命周期 mounted(){} 钩子中调用，或者在 this.$nextTick(()=>{}) 中调用。
如果ref 是循环出来的，有多个重名，那么ref值会是一个数组 ，此时要拿到单个ref 只需要循环就可以。
vue中hash和history的区别 ？
Vue-router的路由分为hash和history模式
1、hash方式
hash方式是指url中存在 # 的一种方式，是vueRouter的默认模式，
当#后面的url地址发生变化时，浏览器不会向服务器发送请求，故不会刷新页面
当#后面的url地址发生变化时，会触发hashChange（hash模式得核心实现原理）事件，从而，我们可以通过监听hashChange事件来知道路由发生变化，从而进一步去更新我们的页面
只可修改hash部分，
当浏览器刷新时，浏览器只会向服务器去请求# 前面的域名服务器下根目录下的index.html文件
hash模式会创建hashHistory对象,hashHistory对象有两个方法，push() 和 replace()
HashHistory.push()会将新的路由添加到浏览器访问的历史的栈顶,而HasHistory.replace()会替换到当前栈顶的路由
2、history模式
history模式得路由和域名之间直接通过/连接，无#符分隔，就是普通url形式
history模式当发生路由跳转时，通过HTML5的history.pushState()方法或者history.replaceState() 方法改变地址栏地址，并将地址的改变记录到浏览器访问栈中。（这里有一点需要注意，它只改变了浏览器地址栏中的地址，但并不会像服务器去发送请求）
当浏览器前进，后台，或者调用back(),forward(), go()等方法时，会触发popstate事件。故，我们可以通过监听popstate事件来获取最新的路由地址，从而更新页面
通过pushstate() 修改的url可以是与当前url同源的任意url。
需要和服务器配合使用，否则容易出现页面404的情况
总结如下：
hash模式带#号比较丑，history模式比较优雅；
pushState设置的新的URL可以是与当前URL同源的任意URL；而hash只可修改#后面的部分，故只可设置与当前同文档的URL；
pushState设置的新URL可以与当前URL一模一样，这样也会把记录添加到栈中；而hash设置的新值必须与原来不一样才会触发记录添加到栈中；
pushState通过stateObject可以添加任意类型的数据到记录中；而hash只可添加短字符串；
pushState可额外设置title属性供后续使用；
hash兼容IE8以上，history兼容IE10以上；
history模式需要后端配合将所有访问都指向index.html，否则用户刷新页面，会导致404错误。
Vue2.0和Vue3.0的区别？
vue经历从2.0到3.0更新之后，简⽽⾔之就是变得更轻，更快，使⽤起来更加⽅便，每⼀次的版本迭代都是对上⼀个版本的升级优化，不管 是对于我们开发者还是对于⽤户体验都是不断地在越来越⽅便，接下来我会着重于开发者来说⼀下两个不同版本的区别
详解
Vue2和vue3的初始化就存在着⼀定区别，⽐如vue3.0可以在安装脚⼿架同时提前安装好⼀些项⽬开发必备的插件，并且3.0提供了可视化创建脚⼿架，可以更加⽅便的对插件和依赖进⾏管理和配置，同时两个版本的⽬录结构也是有些许差别的。（比如：Vue3相对于Vue2，打包工具Vite替代了webpack；TS替代了JS，pinia替代了vuex；Element-plus替代了Element等等）
在开发过程中两个版本的使⽤⽅法虽然在表⾯上没有太⼤的⼀个区别，但是在他的底层⽅⾯去看的话区别还是很⼤的，其中就包括渲染⽅式，数据监听，双向绑定，⽣命周期，vue3更精准变更通知，这⾥着重说⼀下关于双向绑定的更新，
vue2 的双向数据绑定是利⽤ES5的⼀个 API ，Object.definePropert()对数据进⾏劫持 结合发布订阅模式的⽅式来实现的。
vue3 中使⽤了 ES6 的 ProxyAPI 对数据代理，通过 reactive() 函数给每⼀个对象都包⼀层 Proxy，通过 Proxy 监听属性的变化，从⽽实现对数据的监控。扫描二维码关注公众号，回复： 17460660 查看本文章