第一个vue.js实例

第一个vue.js实例

<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
    <!-- 1. 导入Vue的包 -->
	<script src="../../jQuery库/vue-2.4.0.js"></script>
</head>
<body>
	<!-- 将来 new 的Vue实例,会控制这个 div元素中的所有内容 -->
	<!-- Vue 实例所控制的这个元素区域,就是我们的 V  -->
	<div id="app">
		<p>{{msg}}</p>
	</div>

	<script>
		var vm = new Vue({
			el:'#app',	// 表示,当前我们 new 的这个 Vue 实例,要控制页面上的哪个区域
	      	// 这里的 data 就是 MVVM中的 M,专门用来保存 每个页面的数据的
	      	data:{	// data 属性中,存放的是 el 中要用到的数据

	      		msg:'hello VUE'	
	      		//通过 Vue提供的指令,很方便的就能把数据渲染到页面上,程序员不再手动操作DOM元素了【前端的Vue之类的框架,不提倡我们去手动操作DOM元素了】
      	}
		})
	</script>
</body>
</html>

输出结果:hello VUE

猜你喜欢

转载自blog.csdn.net/Pandora_417/article/details/89815820