1. el:挂载点
案例:分别用类、标签选择器来绑定挂载点
<body>
<div id="app" class="app">
{{message}}<br>
<span>{{message}}</span><br>
<span>{{ message }}</span>
</div>
<script src="../js/vue.js"></script>
<script>
var app = new Vue({
// el: "#app",
// el: ".app",
el: "div",
data: {
message: "兮动人"
}
})
</script>
</body>
2. data:数据对象
案例:分别使用对象和数组的形式定义数据对象后取出
<body>
<div id="app">
{{ message }}
<h2>{{ movie.name }} {{ movie.date }}</h2>
<ul>
<li>{{ study[0] }}</li>
<li>{{ study[1] }}</li>
<li>{{ study[2] }}</li>
<li>{{ study[3] }}</li>
</ul>
</div>
<script src="../js/vue.js"></script>
<script>
const app = new Vue({
el: '#app',
data: {
message: 'hello vue',
movie: {
name: "进击的巨人 The Final Season",
date: 2021
},
study: ["前端","后台","运维","安全","测试"]
}
})
</script>
</body>