学习vue3，都会从基础知识点学起。了解setup函数，ref，recative，watch、comptued、pinia等如何使用
今天说vue3组合式api，setup函数
在学习过程中一开始接触到的是这样的，定义数据且都要通过return返回
<script>
export default {
setup(){
cosnt message = 'new day
const logMessage= ()=>{
console.log(message)
}
return {
message,
logMessage
}
}
}
</script>
最新接触到的是这样的
<script setup>
cosnt message = 'new day
const logMessage= ()=>{
console.log(message)
}
</script>
两种不同的写法，那区别是什么呢？
其实在script标签上直接加setup就是语法糖写法
语法糖写法，简单理解就是经过一定的封装，将之前复杂的写法变成一个简单的写法
原先的export default 、setup(){} ,return 都不需要写了
官方提供了一个工具，可以在线看实际运行后的代码
戳这里，跳转到vue SFC Playground官方工具
看右侧实际运行的代码，是同之前的复杂写法的。在底层运行的时候还是一开始的复杂写法，只是通过封装，提供给我们一个简单的写法，这就是语法糖的意义。
