Vue3 setup defineProps怎么用

在Vue3中，可以使用`defineProps`来定义组件的Props属性，它接受一个对象作为参数，对象的属性就是组件的Props属性，属性值可以是一个对象，用来定义更多的属性，如类型、默认值等。

具体使用方法如下：

1. 在组件中引入`defineProps`：

import { defineComponent, defineProps } from 'vue'

2. 在组件中使用`defineProps`来定义组件的Props属性：

const MyComponent = defineComponent({
  props: defineProps({
    msg: {
      type: String,
      required: true
    },
    count: {
      type: Number,
      default: 0
    }
  }),
  template: `
    <div>
      <p>{{ msg }}</p>
      <p>Count: {{ count }}</p>
    </div>
  `
})

在上面的例子中，`defineProps`接受一个对象作为参数，对象的属性就是组件的Props属性。`msg`属性是必需的字符串类型，`count`属性是可选的数字类型，有默认值为0。

3. 在组件中使用Props属性：

<MyComponent msg="Hello World" :count="10" />

在上面的例子中，我们使用`MyComponent`组件，并传递了`msg`和`count`属性。`msg`属性是必需的，所以必须传递一个字符串，`count`属性是可选的，我们传递了一个数字类型的值。

总之，使用`defineProps`可以方便地定义组件的Props属性，避免了手动定义Props属性的繁琐过程。