【VUE复习·1】单向数据绑定v-bind；双向数据绑定v-model

总览

1.单向数据绑定：v-bind
2.双向数据绑定：v-model

一、v-bind 单向数据绑定

1.图解

data 中的值能够影响页面上的值，但是在页面上更改却不能影响 data 中的值。

2.用法说明

<div>
	<input v-bind:value="name">
	<!-- 简写：input :value="name" -->
</div>


data:{
	name:"BaiYue"
}

二、v-model 双向数据绑定

1.图解

1.1 data 中的值能够影响页面上的值，页面上更改也能影响 data 中的值。
1.2 请注意，v-model 只能使用在表单类元素上，也就是可输入的元素上。
1.3 如果在<h2>这种标签上使用 v-model，因为它是非表单类，不可输入，是死的，所以说这样做不仅没有任何意义，更会让 v-model 报错。

2.用法说明

<div>
	<input v-model:value="name">
	<!-- 简写：input v-model="name" -->
</div>


data:{
	name:"BaiYue"
}