全局组件以上的实例中我们的组件都只是通过 component 全"/>

组件的复用

组件的复用
组件的复用
 
你可以将组件进行任意次数的复用:
 
实例
<div id="components-demo">
  <button-counter></button-counter>
  <button-counter></button-counter>
  <button-counter></button-counter>
</div>
 
 
全局组件
 
以上的实例中我们的组件都只是通过 component 全局注册的。
 
全局注册的组件可以在随后创建的 app 实例模板中使用,也包括根实例组件树中的所有子组件的模板中。。
 
全局组件实例
注册一个简单的全局组件 runoob,并使用它:
 
<div id="app">
    <runoob></runoob>
</div>
 
<script>
// 创建一个Vue 应用
const app = Vue.createApp({})
 
// 定义一个名为 runoob 的新全局组件
app.component('runoob', {
    template: '<h1>自定义组件!</h1>'
})
 
app.mount('#app')
</script>

推荐阅读