一、体验Vue
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<div id="app">
{{ str1 }}
</div>
</body>
<script>
var vm = new Vue({ //这个Vue对象用来控制某一个标签里面的数据
el:"#app", //要控制的标签
data:{
str1:"hello vue", //定义一个数据，在id为app的标签内部去使用
}
})
</script>
</html>
```
上面的代码做了什么事情？(了解，重点掌握格式的书写！)
1. 先看js代码，会发现创建了一个Vue对象
2. 创建Vue对象的时候，传入了一个对象：{}
2.1 {}中的el属性：该属性决定了这个Vue对象挂载到哪一个元素上，很明显，我们这里挂载到了id为app的元素上。
2.2 {}中包含了data属性：该属性中通常会存储一些数据，好像上面例子中的str1就是直接定义出来的数据
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
