vue3中setup细节问题总结

一、setup执行的时机问题

  1、setup是在beforeCreate生命周期回调之前就执行了，而且就执行一次

  2、setup在执行的时候，当前的组件还没有创建出来，也就意味着：组件实例对象this根本就不能用

  3、this是undefined,说明，就不能通过this再去调用data/computed/methods/props中的相关内容了

  4、所有的compostion API相关回调函数中也都不可以

二、setup返回值问题

  1、setup中的返回值是一个对象，内部的属性和方法是给html模板使用的。

  2、setup中的对象内部的属性和data函数中的return对象的属性都可以在html模板中使用

  3、setup中的对象中的属性和data函数中的对象中的属性会合并为组件对象的属性

  4、setup中的对象中的方法和methods对象中的方法会合并为组件对象的方法

  5、在vue3中尽量不要混合的使用data和setup及methods和setup，methods中可以访问setup提供的属性和方法，但setup方法中不能访问data和methods

 6、setup不能是一个async函数：因为返回值不再是return的对象，而是promise,模板看不到return对象中的属性数据

三、setup中的参数问题

    setup（props,context）{}

     props参数：是一个对象，里面有父级组件向子级组件传递的数据，并且是在子级组件中使用props接受到的所有的属性，包含props配置声明且传入了的所有属性的对象。

     context参数：是一个对象，里面有attrs对象（获取当前组件标签上的所有的属性的对象，但是该属性是在props中没有声明接收的所有的对象），emit方法（分发事件的），slots对象（插槽），包含没有在props配置中声明的属性的对象，相当于this.$attrs