区别：
一、vue2（Options API）：
在vue2中，编写组件的方式是Options API
特点：
在对应的属性中编写对应的功能模块，比如在data属性中定义数据，methods中定义属性，computed中定义计算属性，watch中监听属性改变，还有一些声明周期钩子
弊端：
1.当实现一个功能的时候，我们就要将这个功能的对应逻辑代码拆分到各个属性中
2.项目一庞大，组件变得更大、更复杂，代码就会非常多，同一个功能的逻辑就会被拆分的很散，当想要修改一个功能逻辑代码的时候，找起来就非常的麻烦
3.当别人阅读你的代码的时候，这个组件会变得难以阅读和理解
二、vue3（Composition API）：
为了解决Options API的弊端，vue3的Composition API为了解决这种碎片化代码，避免一个功能的逻辑代码太分散，于是增添了一个setup函数，这个选项可以用来替代之前所编写的大部分其他选项，比如data的属性，methods，computed，watch，一些生命周期钩子函数。
<template>
<div>
<h2>{{ message }}</h2>
</div>
</template>
<script>
export default {
props: {
message: {
type: String,
default: "",
},
},
// setup(props, context) {
// context解构的写法
setup(props, { attrs, slots, emit }) {
console.log(props.message);
console.log(attrs.id, attrs.class);
console.log(slots);
console.log(emit);
},
};
</script>
<style scoped></style>想要详细了解setup函数的使用，可参考我的另一篇文章