vue组件基础学习(一)

1.vue组件示例

1)html

2)js

一个通过 new Vue 创建的 Vue 根实例中,把这个组件作为自定义元素来使用

vue组件基础学习(一)_第1张图片

注:

一个组件的 data 选项必须是一个函数,因此每个实例可以维护一份被返回对象的独立的拷贝:

data: function () {
  return {
    count: 0
  }
}

 

2.组件注册

为了能在模板中使用,这些组件必须先注册以便 Vue 能够识别。这里有两种组件的注册类型:全局注册局部注册。至此,我们的组件都只是通过 Vue.component 全局注册的:

Vue.component('my-component-name', {
  // ... options ...
})

全局注册的组件可以用在其被注册之后的任何 (通过 new Vue) 新创建的 Vue 根实例,也包括其组件树中的所有子组件的模板中。

你可能感兴趣的:(vue)