Vue2和Vue3的区别

具体使用的不同

 

vue2要求有一个根元素 vue3则不要求

vue2的script要求抛出一个对象 vue3则不要求

vue2 data(){return {}}

vue3是ref和reactive声明的状态

 vue2和vue3双向数据绑定原理发生了改变

实例化 

生命周期

父子传参不同，setup()函数特性

 ​​​​​​        

import { ref } from 'vue'
const count = ref(0)
console.log(count.value)

        8，从setup() 中返回得对象上得property 返回并可以在模板中被访问时，它将自动展开为内部值。        

        9，不需要在模板中追加.value。setup函数只能是同步的不能是异步的。

建立数据data

        vue2是把数据放入data中，vue3就需要使用一个新的setup()方法，此方法在组件初始化构造得时候触发。使用一下三个步骤来简=建立反应性数据： 1. 从vue引入reactive；使用reactive() 方法来声明数据为响应性数据；3. 使用setup()方法来返回我们得响应性数据，从而template可以获取这些响应性数据。

给父组件传值emit

vue2：this.$emit()
vue3：setup(props,context){context.emit()}