Vue入门之vue框架简介&库和框架的区别&MVVM介绍&安装vue&vue所管理的边界&双向数据绑定&vue事件&vue的生命周期

vue框架简介

1 什么是Vue.JS ?

Vue是一个构建用户界面(UI)的[渐进式]JavaScript框架

官网：Vue.js

vue实现前后端分离

Vue作者：尤雨溪/中国无锡

2 MVVM为什么要学习Vue框架 什么是框架？框架的作用？

框架：半成品的项目。提高开发效率。

3 前端提高开发效率的发展历程：

DOM：原生JS -> JQuery -> 前端模板引擎 （DOM操作，降低了ajax请求函数的复用性）

2.库和框架的区别

2.1 库(Library)，本质上是一些函数的集合。每次调用函数，实现一个特定的功能，接着把控制权交给使用者
以前库 是jQuery

框架是easyui  border  layui

模式mvc

    代表：jQuery
      jQuery这个库的核心：DOM操作，即：封装DOM操作，简化DOM操作

2.2 框架(Framework)，是一套完整的解决方案，使用框架的时候，需要把你的代码放到框架合适的地方，框架会在合适的时机调用你的代码 
      代表：vue
      框架规定了自己的编程方式，是一套完整的解决方案
      使用框架的时候，由框架控制一切，我们只需要按照规则写代码
      框架的侵入性很高(从头到尾

MVVM的介绍

MVVM，一种更好的UI模式解决方案，MVVM通过数据双向绑定让数据自动地双向同步

一个核心的概念就是不让用户去操作dom元素

MVVM ===> M / V / VM
   M：model数据模型
   V：view视图
   VM：ViewModel 视图模型    虚拟dom

   V（修改数据） -> M
   M（修改数据） -> V
   数据是核心

easyui=jquery+html4
    treenodes=
    {
        id:1
        text:后勤管理
        children：【
        】
    }

解析成json对象
    将json对象进行遍历
    for node in treenodes.children
    渲染菜单的功能是操作左侧页面的dom节点

   注1：虽然没有完全遵循MVVM模型，Vue的设计无疑受到了它的启发。另外一个js框架                           “knockout”完全遵循MVVM模型
   注2：学习Vue要转化思想：“不要在想着怎么操作DOM，而是想着如何操作数据！！！
 

四、cdn的下载及入门案例

手动下载

      <!-- 开发环境版本，包含了有帮助的命令行警告 -->
      <script src="dist/vue.js"></script>

      <!-- 生产环境版本，优化了尺寸和速度 --