vue学习笔记系列（二）

动手第一个demo

我们多少都会了解vue的核心就是数据，实现了数据的双向绑定。话不多说先上代码：

<div>
	<input  type="text" v-model="name" placeholder="请输入你的名字">
	<h1>你好，{
  {name}}</h1>
</div>

<script>
	var app = new Vue({
		el:'#app',
		data:{
			name:''	
		}
	})
</script>

此时输入的表单的数据就会自动绑定到name这个值上面去，然后显示到页面上。

1 、 Vue实例与数据绑定

创建实例，这里的构造函数Vue就创建了一个app实例

var app = new Vue({
	el:'#app',
	data:{
		name:''	
	}
})

必不可少的就是el，用于指定一个已存在的DOM元素来挂载Vue实例，挂载成功后我们可以通过app.$el来访问该元素。Vue实例本身代理了data对象里的所有属性：

var myData={
	a:1
}

var app = new Vue({
	el:'#app',
	data:{
		myData
	}
})
console.log(app.a)