vue3 script setup 注册组件
时间: 2023-06-30 20:06:55 浏览: 60
在 Vue 3 的 `script setup` 中注册组件可以使用 `defineComponent` 函数,该函数接受一个组件配置对象参数并返回一个组件选项对象。具体的步骤如下:
1. 在 `script setup` 中引入 `defineComponent` 函数:
```javascript
import { defineComponent } from 'vue'
```
2. 在 `script setup` 中创建组件配置对象:
```javascript
const MyComponent = defineComponent({
// 组件选项
})
```
3. 在组件配置对象中定义组件的选项,例如 `name`,`props`,`setup` 等:
```javascript
const MyComponent = defineComponent({
name: 'MyComponent',
props: {
// 组件的 props
},
setup() {
// 组件的 setup 函数
}
})
```
4. 最后,使用 `export default` 导出组件选项对象:
```javascript
export default MyComponent
```
完整示例代码如下:
```javascript
<template>
<!-- 组件模板 -->
</template>
<script setup>
import { defineComponent } from 'vue'
const MyComponent = defineComponent({
name: 'MyComponent',
props: {
// 组件的 props
},
setup() {
// 组件的 setup 函数
}
})
export default MyComponent
</script>
```
通过以上步骤,我们就可以在 `script setup` 中注册组件了。