视频  

  vue介绍  

Vue.js的定位是一个渐进式框架 

前端三大mvvm框架 vue , react ,angular

Vue.js受到越来越多关注的一个重要原因：你只需要具备基本的HTML/JavaScript/CSS 基础，就可以快速上手，让你用上这些现代Web开发中的先进技术来提高你的生产力：

vue官网

与Angular和React出自巨型公司不同，Vue.js基本上是以作者（尤雨溪/Evan YOU）

  创建你的第一个vue页面  

1.引入vue.js库



<script src="vue.js"></script>





2. 创建vue实例



<script>
new Vue({
      el：'#app',
      data: {msg:'hello Vue!'}
   })
</script>





3. 完整html导入



<div id="app">
   {{message}}
</div>





4.完整的helloWorld代码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="../assets/js/vue.js"></script>
  <title>Helloworld</title>
</head>
<body>
  <h1>Hello World</h1>
  <hr>
  <div id="app">
      {{message}}
  </div>
  <script type="text/javascript">
      var app=new Vue({
          el:'#app',
          data:{
              message:'hello Vue!'
          }
      })
</script>
</body>
</html>

最后我们先来了解什么是MVVM框架。

MVVM是Model-View-ViewModel的缩写，ViewModel是Vue.js的核心，它是一个Vue实例。Vue实例是作用于某一个HTML元素上的，这个元素可以是HTML的body元素，也可以是指定了id的某个元素。MVVM模式要实现的就是

1.数据变量（model）发生改变，视图（view）也改变，

2.视图（view）改变，数据变量（model）也发生改变