Vue.js初步
2019-03-06 本文已影响0人
皮皮力_996a
Vue官网
Mvvm模式
- Model-View-View-Model模式，由MVC衍生而来
View和ViewModel之间通过双向绑定(data-binding)建立联系。
现代的前端开发模式
- 前端的三驾马车 ：Angular、React、Vue
-
web制作实例
1.vue.js起步
1.1首先引入 Vue：
image.png
image.png
1.2设置vue的根容器
image.png
1.3实例化一个VUE对象
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- 通过cdn引入vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<!-- vue-app根容器 -->
<div id="app">
<h2>{{message}}</h2>
<h2>{{name}}，{{age}}</h2>
</div>
<script type="text/javascript">
//实例化一个vue对象
var app = new Vue({
el: '#app',
data:{
message:'Vue.js',
name:'尤雨溪',
age:'30岁'
}
})
</script>
</body>
</html>
