setup
是一个接收 props
和 context
的函数
它是 Vue3 的一个新语法糖,在 setup 中。所有 ES 模块导出都被认为是暴露给上下文的值,并包含在 setup() 返回对象中。相对于之前的写法,使用后,语法也变得更简单。
在添加了setup的script标签中 ,就不用声明和方法,这种写法会自动将所有顶级变量、函数,均会自动暴露给模板使用。
使用方法也很简单,就只需要在script标签中加入setup就可以了。
<script setup>
const a = 1
<script>
这种写法是暴露了组件内部所有属性和方法的统一api
使用这种写法,组件只需要引入就可以使用,属性和方法也不需要return来返回,也不需要写setup和export default,自定义的指令也可以在template中自动获取。
调用时机:创建组件实例之后初始化props,然后再调用setup函数
从vue的生命周期角度来看,他比beforeCreate还要靠前调用。