<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>vue学习初级</title>
</head>
<body>
<div id="app">
<!--这个是双大括号插值{{msg}},任意的值都能插入-->
<h2>{{msg}}</h2>
</div>
<script src="js/vue/dist/vue.min.js"></script>
<script>
//创建实例化对象
new Vue({
el:'#app',//目的地
data:{
//既可以是个对象,也可以是个函数
msg:'666'
},
//template模板
template:'<div>{{msg}}</div>'
});
</script>
</body>
</html>
el里的内容如果是‘#。。’,则在对应的div或者是其他元素里的属性应是id。若是‘.。。’那么就应该是用class,如以下的代码
<div id="demo">{{msg}}</div>
<div class="app">{{msg}}</div>
var a = new Vue({
el: '#demo',
data: {
msg: 'hello vue'
}
});
var cl = new Vue({
el: '.app',
data: {
msg: 'hello vue'
}
})
结果均能正常显示