vue setup 入参

Vue 3中的`setup`函数是组件选项之一，用于在组件实例化之前执行一些初始化工作。它接收两个参数：`props`和`context`。

- `props`: 该参数用于接收外部传入的属性值，并且以响应式方式进行管理。你可以直接在`setup`函数内部使用`props`对象的属性。
- `context`: 是一个拥有一些有用方法和属性的对象，例如上下文中的`attrs`、`slots`和`emit`等。你可以使用`context`对象来访问这些特性，以及在组件内部进行事件触发、插槽处理等操作。

以下是一个简单的示例，展示了如何使用`setup`函数及其入参：

import { ref } from 'vue';

export default {
  props: {
    message: {
      type: String,
      required: true
    }
  },
  setup(props, context) {
    const count = ref(0);

    // 访问 props
    console.log(props.message);

    // 使用 context.attrs
    console.log(context.attrs);

    // 使用 context.slots
    console.log(context.slots);

    // 使用 context.emit
    context.emit('customEvent');

    return { count };
  }
}

在上述示例中，我们通过`props`参数访问了传入的属性值，通过`context.attrs`访问了组件的属性集合，通过`context.slots`访问了插槽内容，以及通过`context.emit`触发了自定义事件。最后，将`count`变量暴露给组件的模板使用。