如何在Vue中使用组件作为可重用的模板？

<!-- 定义一个名为HelloWorld的组件 -->
<template>
  <div>
    <h1>{{ message }}</h1>
    <button @click="changeMessage">Change Message</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello, World!'
    }
  },
  methods: {
    changeMessage() {
      this.message = 'Hello, Vue!'
    }
  }
}
</script>

<!-- 在Vue实例中注册HelloWorld组件 -->
<script>
import HelloWorld from './HelloWorld.vue'

export default {
  components: {
    HelloWorld
  }
}
</script>

<!-- 在Vue模板中使用HelloWorld组件 -->
<template>
  <div>
    <HelloWorld></HelloWorld>
    <HelloWorld></HelloWorld>
  </div>
</template>