初始Vue笔记之——表单输入绑定

v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源。应该通过 JavaScript 在组件的 data 选项中声明初始值。

对于需要使用输入法 (如中文、日文、韩文等) 的语言，你会发现 v-model 不会在输入法组合文字过程中得到更新。如果你也想处理这个过程，请使用 input 事件。

组件基础

组件的复用

每用一次组件，就会有一个它的新实例被创建。

data 必须是一个函数

你可能会发现它的 data 并不是像这样直接提供一个对象：

data: {
  count: 0
}

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

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

every component must have a single root element (每个组件必须只有一个根元素)

可以将模板的内容包裹在一个父元素内，来修复这个问题。例：

<div class="blog-post">
  <h3>{{ title }}</h3>
  <div v-html="content"></div>
</div>

 

1