01-Vue

  • html-css-JS 应用 =>（组件 + 数据）分而治之、独立管理
  • 核心原理：template（组件）+ 数据（响应式）=> 虚拟DOM（编译器）（js 对象）=> 渲染 真正的DOM

1. init

  1. vuejs 官网open in new window
  2. 核心原理：template（组件）+ 数据（响应式）=> 虚拟DOM（编译器）
  1. template 进行编译，没有 template
  2. 对 el 进行编译
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
		  {{ message }}
		</div>
		<script src="vue2.5.1.js"></script>
		<script>
			var vm = new Vue({
				el:"#app",
				data:{
					message:"hello Vue"
				},
                template:"<div id='app'><span>{{ message }}</span></div>"
			})

			console.log(vm.$options)
		</script>
	</body>
</html>













 



 






2. 生命周期

VUF3WEZENHkzVnB4ZkU3UmpZVHZQb0JCMmt1VWZEazNPWDgwcnRJPQ==