vue2与vue3区别

import { toRefs } from 'vue'
setup(props) {
	const { title } = toRefs(props)
	console.log(title.value)
}

setup()函数只执行一次，props为组件传参绑定的属性，props是响应性的值。如果使用 ES6 对其进行结构会破坏响应性结构，可以使用 toRefs 函数在 setup() 中操作

**

 

# 1. Vue3.0与Vue2.0的区别
Vue2.0使用的Virtual Dom实现的渲染
Vue3.0不论是原生的html标签还是vue组件，他们都会通过h函数来判断，如果是原生html标签，在运行时直接通过Virtual Dom来直接渲染，同样如果是组件会直接生成组件代码
**



# 2. Vue3.0生命周期
beforeCreate/created => setup
boforeMount => onBeforeMount
Mounted => onMounted
beforeUpdata => onBeforeUpdate
Updated => onUpdated
beforeDestroy -> onBeforeUnmount
destoryed => onUmonted
errorCaptured -> onErrorCaptured




# 3.Vue 3.0双向绑定原理的实现
proxy方法通过new Proxy()各个属性的setter，getter，在数据变动时发布消息触发相应的监听回调。
Vue 3.0与Vue 2.0的区别仅是数据劫持的方式由Object.defineProperty更改为Proxy代理，其他代码不变。




# 4.Vue3.0的亮点
编译性能比vue2快
按需编译，体积比vue2小。
支持组合API(类似与React hook).
更好的TS支持。
暴露了自定义渲染API。
使用更先进的组件。




# 5.Vue3.0比Vue2.0快的原因
重写了 虚拟dom
优化了编译模板, 运行时编译
update的性能提高哦
ssr速度提高
支持 了typescript
在组件化编程时 ,不在限制一个节点