vue3中自定义标签对属性

在 Vue 3 中，你可以使用 `defineComponent` 函数来创建组件，并在组件选项中定义 props 属性来接收自定义属性。

下面是一个简单的例子：

<script>
import { defineComponent } from 'vue';

export default defineComponent({
  name: 'MyComponent',
  props: {
    message: {
      type: String,
      required: true
    },
    count: {
      type: Number,
      default: 0
    }
  },
  template: `
    <div>
      <p>{{ message }}</p>
      <p>Count: {{ count }}</p>
    </div>
  `
});
</script>

在上述代码中，我们使用 `defineComponent` 函数创建了一个名为 `MyComponent` 的组件，并定义了两个 props 属性：`message` 和 `count`。`message` 属性是必需的字符串类型，而 `count` 属性是可选的数字类型，默认值为 0。

在组件的模板中，我们可以像使用普通属性一样使用这些自定义属性：`{{ message }}` 和 `{{ count }}`。

然后，我们可以在任何地方使用 `<my-component>` 标签来引用该组件，并在标签中使用自定义属性：

<template>
  <div>
    <my-component message="Hello, Vue 3!" :count="10" />
  </div>
</template>

在这个示例中，我们将 `message` 属性设置为字符串 "Hello, Vue 3!"，将 `count` 属性设置为数字 10。注意，在设置 `count` 属性时，我们使用了 `:` 前缀来绑定一个动态值。

希望这能解决你的问题！