本文共 709 字，大约阅读时间需要 2 分钟。

setup

• 新的 option，仅在beforeCreate之前执行一次

// setup 执行时，组件还没有开始创建，因此 this 为 undefined  setup () {
       console.log('this in setup:', this)  }

• 如果该函数返回对象，对象中的属性或方法，在模板中可以直接使用

• setup 中返回的对象会同data、methods合并到组件对象上

export default defineComponent({
     name: 'App',  setup () {
       return {
         inSetup: 'setup',    }  },  data() {
       return {
         inData: 10    }  },  methods: {
       inMethods () {
         console.log(123)    }  },  mounted () {
       console.log(this)  }});

• setup 接收两个参数 props、context
• props：组件声明接收，且父组件传递了的属性
• context: 包含 attrs: 父组件传递的但未声明接收的属性、emit：用来触发自定义事件、slots: 父组件传递的插槽组件
  

// App.vue
   

// Child.vue
   

转载地址：http://mpqt.baihongyu.com/