<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>vue基本代码</title>
<!-- 1.引入vue.js -->
<script type="text/javascript" src="./js/vue.js"> </script>
</head>
<body>
<!-- 将来new的Vue实例， 会控制这个元素中的所有内容 -->
<!-- Vue实例所控制的这个元素区域 ， 就是我们的v -->
<div id="app" >
<p>{{msg}}</p>
</div>
<script type="text/javascript">
// 2创建一个Vue实例
// 当我们导入包后,在浏览器的内存中, 就多了一个Vue构造函数
// 注意:这个new出来的vm 对象, 就是我们MVVM中的 vm调度者
var vm=new Vue({
el:'#app', //表示,当我们new的这个Vue实例,要 控制页面上的哪个区域
//这里的data就是MVVM中的M,专门用来保存,每个页面的数据的
data(){ //data属性中, 存放的是 el 中要用到的数据
return {
msg:'欢迎学习vue喽' //数据渲染,不再手动操作dom
}
}
})
</script>
</body>
</html>
1vue基本代码
猜你喜欢
转载自www.cnblogs.com/maomao-Sunshine/p/11572854.html
今日推荐
周排行