组件是Vue.js最强大的功能之一，它们可以帮助我们扩展基本的HTML元素，封装可重用的代码。
单文件组件
<template>
<div class="hello">
<h1>{{ title }}</h1>
<button @click="increment">点击计数: {{ count }}</button>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
title: String
},
data() {
return {
count: 0
}
},
methods: {
increment() {
this.count++
}
}
}
</script>
<style scoped>
.hello {
text-align: center;
margin: 20px;
}
</style>
提示： 这是一个重要的概念，需要特别注意理解和掌握。
注意： 这是一个常见的错误点，请避免犯同样的错误。