vue3 父组件怎么引入子组件过来用

在 Vue.js 3 中，父组件想要使用子组件通常通过以下步骤：

1. **创建子组件**：首先，你需要在 `src/components` 目录下创建一个名为 `MyComponent.vue` 的文件，这是子组件的源文件。在这个文件里，编写组件的模板、数据和方法。

<template>
  <div>子组件内容</div>
</template>

<script>
export default {
  name: 'MyComponent',
  // ... 如果有其他属性，如 props 或 methods
}
</script>

2. **导入并注册子组件**：在父组件的 `App.vue` 或者你想使用的任何地方，使用 `import` 导入子组件，然后在 `<script>` 部分使用 `components` 对象注册它。

// 父组件 App.vue
<template>
  <div>
    <my-component></my-component>
  </div>
</template>

<script>
import MyComponent from '@/components/MyComponent.vue';

export default {
  components: {
    MyComponent
  },
  // ...
}
</script>

3. **在父组件中使用子组件**：在父组件的模板中，可以直接像 HTML 标签一样引用子组件 `<my-component>`。这里的 `my-component` 就是你在组件注册时设置的名称。

当你完成以上步骤后，父组件就可以通过 `<my-component>` 的标签来显示和操作子组件了。记得确保已经安装好Vue，并且路径`('@/components/MyComponent.vue')`指向正确的组件位置。