vue3之setup的理解与使用
一、含义①为什么要使用setup?写一个大型组件时,逻辑关注点的列表很长,不利于维护和阅读;所以需要把一个逻辑关注点的代码收集在一起会更好,由此诞生组合式API,即vue中用到的setup。就像我们要做卤鸡蛋,原来材料有四堆香料:八角、桂皮、香叶、茴香(data、method、computed、watch);一样一样找太麻烦,就打包做成香料袋,一次放一个袋子(setup)就行二、执行时机在组件创建
·
一、含义
①为什么要使用setup?
写一个大型组件时,逻辑关注点的列表很长,不利于维护和阅读;所以需要把一个逻辑关注点的代码收集在一起会更好,由此诞生组合式API,即vue中用到的setup。
就像我们要做卤鸡蛋,原来材料有四堆香料:八角、桂皮、香叶、茴香(data、method、computed、watch);一样一样找太麻烦,就打包做成香料袋,一次放一个袋子(setup)就行
二、执行时机
在组件创建之前执行,即data、method、computed被解析之前,所以它们在setup中无法被获取。
setup位于created 和beforeCreated之前,用于代替created 和beforeCreated
三、两个参数,setup ( props , context )
① props : 响应式的,不能被解构,非要解构可用toRefs
② context :非响应式的,可以被解构,就是一个普通的js对象,作用是暴露其他可用的值(attrs、slots、emit、expose)
四、组件的属性
只能访问以下四种:props、attrs、slots、emit
更多推荐
所有评论(0)