vue3在script中写setup

### 回答1：
Vue3中的`setup`函数是在组件实例化之前执行的函数，它可以用来设置组件的响应式数据、计算属性、方法等。在`setup`函数中，我们可以使用Vue3提供的新的响应式API来创建响应式数据，例如`ref`、`reactive`等。同时，我们也可以使用普通的JavaScript语法来定义组件的计算属性、方法等。总之，`setup`函数是Vue3中非常重要的一个函数，它可以让我们更加方便地管理组件的状态和行为。

### 回答2：
Vue3的核心改进之一是通过引入新的composition api将逻辑代码从生命周期钩子函数中分离出来。composition api 的首要目标是提高代码重用性和可维护性。为实现这一目标，Vue3中新增了一个 `setup` 函数，在 `script` 标签中提供了一种新的组合方式，帮助我们更好地组织代码。

`setup` 函数的主要职责是在组件实例创建之前进行一些初始化，初始化组件的变量、将处理逻辑拆分成函数并将函数导出，使得可以在组件之间共享逻辑。它需要以对象形式的形参传递，这个对象中可以有两个选项 `props` 和 `ctx`。

在 `setup` 函数中，可以通过 `props` 获取到组件传递来的 props，使用 `ctx` 可以更方便地访问到组件的上下文。`setup` 函数需要返回一个对象，这个对象包含一个 `render` 函数，该函数返回组件的节点模板。由于 `setup` 函数中不再有生命周期函数的嵌套，这一点也解决了生命周期函数嵌套难以阅读的问题。

除此之外， `setup` 函数还能通过 ref 和 reactive 等 api 管理组件的状态。 `ref` 创建一个新的响应式对象，其值可以是任意类型， `reactive` 将一个普通对象转换为响应式对象，这就意味着只有响应式对象中的数据改变时，页面才会重新渲染。这两个 api 都是 Vue.js 3.0 新增加的，而 `ref` 更加轻量，只用于单独的变量绑定，而 `reactive` 用于包含多个属性的对象。

总之，`setup` 函数的引入是 Vue.js 中的一项大型升级，使我们可以更好地组织代码，将多个功能单元拆分为小的、可重用的部分，并在组件之间共享逻辑。

### 回答3：
Vue3中，我们可以使用新的API——setup来代替Vue2中的created和mounted等hooks函数。在script中写setup，可以让我们更加方便地处理组件逻辑，并提高页面性能。

setup函数是一个必须有的函数，它接收两个参数：props和context。props是传入组件的属性值，context包含了一些必要的上下文信息。

我们在setup中可以进行数据的声明和初始化，也可以使用Vue3新增的reactive函数来声明可响应式的数据对象。在这里，我们还可以定义method和computed属性，以及导入需要使用的函数和组件。

除此之外，由于setup函数是在组件创建之前就会执行，因此我们也可以把一些需要异步获取的数据等操作放在这里进行处理，避免了挂载后才去获取数据的延迟。

需要注意的是，在setup函数中是不能使用this的。而在template中，我们可以使用v-bind或者简写方式直接调用在setup中定义的数据和方法。

总的来说，使用setup函数可以让我们更加方便和灵活地处理组件逻辑，提高组件的性能和复用性，使得Vue3变得更加强大和易用。