【汇智学堂】 Vue框架基础（2）

双向数据绑定

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<h1>{{message}}</h1>			
			<input type="text" v-model="message" />			
		</div>
	</body>

	<script src='https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js'></script>		
		<script>
			var vm=new 	Vue({
				el:'#app',
				data:{
					message:'hello world,I am Vue.js'
				}
			});
		</script>			
</html>

实现标题展示随着输入框输入变化而变化。

效果图展示

posted on 2019-12-20 15:48  Bruce丶Lee  阅读(70)  评论(0)    收藏  举报

导航