一、setup 函数
setup() 是在 beforeCreate 钩子之前执行的一个函数。
setup 接收 2 个参数:
- props:一个响应式的对象,包含了从父组件中传过来的所有属性。不能使用 ES6 解构。
- context:一个普通的对象,暴露了其它可能在 setup 中有用的值。能使用 ES6 解构。
setup 的返回值:
- 一个对象:对象里的属性都可以在模板中使用。
- 当 setup 函数返回一个对象时,该对象里的属性均可在模板中使用。只不过,如果该属性是个对象,在模板里使用该对象时,该对象会被自动浅解包,因此,不应在模板中直接使用
对象.属性名 的形式访问该对象里的属性。
- 一个函数:该函数可以直接使用在同一作用域中声明的响应式状态。
setup() 函数的可访问性
| 可访问到属性 | 不可访问到的属性 |
|---|
| props | data |
| attrs | computed |
| slots | methods |
| emit | refs |
二、defineComponent 函数
三、<script setup> 标签
<script setup> 标签是 setup 文件。
setup文件只是 setup 函数的语法糖。