Vue.js入门之表单和组件基础
前面几期整理，详见博客
Vue.js框架入门之vue简介和基本语法(一）
Vue.js框架入门之基本语法(二)
Vue.js框架入门之条件渲染、列表渲染、事件处理
现在来续写第四期—Vue.js的表单和组件基础
一、表单输入绑定这节我们为大家介绍 Vue.js 表单上的应用。
我们可以用 v-model 指令在表单控件元素上创建双向数据绑定。
模块化：是从代码逻辑的角度进行划分的；
组件化：是从UI界面的角度进行划分的。
组件（Component）是 Vue.js 最强大的功能之一，组件可以扩展 HTML 元素，封装可重用的代码。
组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树，如下图所示：
这里有一个 Vue 组件的示例：
// 定义一个名为 button-counter 的新组件
Vue.component('button-counter', {
data: function () {
return {
count: 0
}
},
template: ''
})
组件是可复用的 Vue 实例，且带有一个名字：在这个例子中是 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用：
//也可以创建很多个button-counter组件，因为组件是可以复用的
new Vue({ el: '#demo' })
可以看到页面可以渲染出一个button组件
因为组件是可复用的 Vue 实例，所以它们与 new Vue 接收相同的选项，例如 data、computed、watch、methods 以及生命周期钩子等。仅有的例外是像 el 这样根实例特有的选项。
关于组件的具体使用方法下期会详细介绍~~~~
作者：那是我呐
相关文章
Sally
2021-01-16
Dawn
2020-01-16
Galatea
2020-03-16
Claire
2021-05-21
Abbie
2023-07-20
Yvonne
2023-07-20
Rasine
2023-07-20
Zahirah
2023-07-20
Tina
2023-07-20
Kande
2023-07-20
Rae
2023-07-20
Flower
2023-07-20
Heather
2023-07-20
Vala
2023-07-20
Tertia
2023-07-20
Fredrica
2023-07-20
Bree
2023-07-20
Katherine
2023-07-20