vue里的 components

在Vue中，components选项用于注册局部组件或全局组件。通过components选项，我们可以在Vue实例或组件中声明和使用其他组件。

1. 局部注册组件：
在Vue实例或组件中，可以通过components选项来注册局部组件。局部组件只能在当前实例或组件内部使用。

示例：

<template>
  <div>
    <my-component></my-component>
  </div>
</template>

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

export default {
  components: {
    'my-component': MyComponent
  }
}
</script>

在上述示例中，通过import语句导入了一个名为MyComponent的组件，并在components选项中注册了这个组件。然后，可以在模板中使用`<my-component></my-component>`标签来引用和渲染这个局部注册的组件。

2. 全局注册组件：
除了局部注册组件，Vue还支持全局注册组件。全局注册的组件可以在任何Vue实例或组件中使用，无需再次注册。

示例：

// 在全局范围内注册组件
Vue.component('my-component', MyComponent);

在上述示例中，通过Vue.component方法全局注册了一个名为'my-component'的组件。然后，在任何Vue实例或组件中都可以使用`<my-component></my-component>`标签来引用和渲染这个全局注册的组件。

需要注意的是，组件名称需要使用驼峰命名法或短横线分隔命名法，并且在模板中使用时，组件名称需要以标签形式使用（即以`<`和`>`包裹组件名称）。