Vue基础组件简单实例

1、下面是官方提供的示例// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>'})可以在一个通过 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用：<div id="components-demo"> <button-counter></button-counter></div>new Vue({ el: '#components-demo' })组件是可复用的 Vue 实例，与 new Vue 接收相同的选项，例如 data、computed、watch、methods 以及生命周期钩子等。仅有的例外是像 el 这样根实例特有的选项。

2、组件是一个自定义元素或称为一个模块，包括所需的模板、逻辑和样式。对于大型应用来说，有必要将整个应用程序划分为组件，以便开发可管理。