<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>初识Vue</title>
<!-- 引入Vue -->
<script type="text/javascript" src="../JS/vue.js"></script>
</head>
<body>
<!--
初识Vue:
1.想让Vue工作,就必须创建一个Vue实例,且要传入一个配置对象.
2.root容器里的代码依然符合html规范,只不过混入了一些特殊的Vue语法.
3.root容器里的代码被称为【Vue模板】.
4.Vue和实例是一一对应的关系.
5.真实开发中只有一个Vue实例,并且会配合着组件一起使用.
6.{{xxx}}中的xxx要写js表达式,且xxx可以自动读取到data中的所有属性.
7.一旦data中的数据发生改变,那么页面中用到该数据的地方也会自动更新.
注意区分：js表达式 和 js代码（语句）
1.表达式：一个表达式会产生一个值,可以放在任何一个需要值的地方:
(1). a
(2). a+b
(3). demo(1)
(4). x===y ? "a":"b"
2.js代码（语句）
(1). if(){}
(2). for(){}
-->
<!-- 准备好一个容器 -->
<div id="root">
<h1>hello word!</h1>
<h1>我的名字是：{{name}},{{address}},{{Date.now()}}</h1>
</div>
</body>
<script>
Vue.config.productionTip = false;//关闭F12开发者VUE引用提示
//创建Vue实例
new Vue({
el:"#root", //el用于指定当前Vue实例为哪个容器服务,值通常为css选择器字符串
data:{//data中用于存储数据,数据供el所指定的容器去使用,值我们暂时先写成一个对象.
name:"梦晓轩",
address:"上海"
}
});
</script>
</html>