Vue-简单使用（起步）

（一）为什么要使用Vue？

1-Vue.js 是一套构建用户界面的前端框架技术。

2-Vue只关注视图（页面）层的开发，文档非常丰富、易于上手，流行度高，拥抱经典的web技术、早起灵感来源于angular。

3-vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点。

4-与Vue有关联的话题 渐进式、组件、路由、webpack、loader、babel、vue-cli、响应式、VirtualDOM(虚拟DOM)、NPM、SPA、ES6、单文件组件、双向数据绑定等。

5-vue是前端的主流框架之一，和Angular、React 一起，并成为前端三大主流框架！

（二）获得Vue

网站：

https://cn.vuejs.org 官方地址(服务器在外国，访问速度慢)

https://vue.docschina.org/ 官方地址镜像(服务器在中国，访问速度快)

1) 直接下载

• 开发版本：https://cdn.jsdelivr.net/npm/vue/dist/vue.js

• 生产版本：https://cdn.jsdelivr.net/npm/vue 。

2）直接在html文件中来引入vue.js文件。

（三）简单使用

步骤：

1.引入vue

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

2.创建vue渲染容器

<div id="app">
  <h2>{{ msg }}</h2>
</div>

3.创建vue实例对象

<script>
  let vm = new Vue({
    el: '#app',
    data: {
      msg: '我叫404路西法-肖米'
    }
  })
</script>

（四）MVVM

M:model 数据操作部分 (vue的data部分)

v:view 视图展示部分 (div容器部分)

vm: view & model 视图和数据的关联部分 (el和data通过实例化new Vue关联)

---下一篇讲解Vue指令的使用---

指令 (Directives) 是带有 v- 前缀的html标签的特殊属性。

指令属性值应该是一个单独的javascript表达式（V-for除外）。

指令的工作是在其表达式的值发生变化时，将其产生的连带影响，响应式地作用于 DOM。