Vue_Vue2的data()中数据，在vue3中怎么获取？
小小记录一下，这两天在用vue3来搭建项目，写法和vue2相比真的区别有点大了。
Vue2中写法<template><div>{{message}}</div></template><script>export default { data () { return { message:"message" } }}</script><template> <div class="container"> <header>{{state.username}}</header> </div></template><script>import { reactive } from "vue";export default { props: { title: String }, setup() { const state = reactive({ username: "444444" }); return { state }; }};</script>主要的原因是vue2和vue3建立数据 data 方法不同
在Vue3.0，我们就需要使用一个新的setup()方法，此方法在组件初始化构造的时候触发。
并且，setup()函数是Vue3新增的生命周期函数，我们应该可以理解为在这个生命周期里定义了对象state来接收我们这个界面的所有全局变量。
vue3 的生命周期函数：
| 生命周期函数 | 解释 |
|---|---|
| setup() : | 开始创建组件之前，在beforeCreate和created之前执行。创建的是data和method |
| onBeforeMount() : | 组件挂载到节点上之前执行的函数。 |
| onMounted() : | 组件挂载完成后执行的函数。 |
| onBeforeUpdate(): | 组件更新之前执行的函数。 |
| onUpdated(): | 组件更新完成之后执行的函数。 |
| onBeforeUnmount(): | 组件卸载之前执行的函数。 |
| onUnmounted(): | 组件卸载完成后执行的函数 |
还在慢慢看vue3