vue.js的基础学习

vue是什么？

1.vue是目前最火的框架之一，主要用于单页面应用程序，也可用于手机app开发，其他两个还有angular.js、react.js一起被称为前端三大主流框架

2.vue是一套渐进式框架，数据层和视图层的双向数据绑定是开发更方便

3.4.vue有配套的第三方类库，可以将其整合起来做大型项目的开发。

vue的优缺点

优点：
1、简单易用；
2、灵活渐进式；
3、轻量高效。

缺点：
1.缺乏高阶教程、文档与书籍；
2.VUE不支持IE8；
3.生态环境差不如angular和react
4.社区不大

vue安装的三种方式

1.独立版本安装
在vue.js官网上直接下载，并用script标签引入
官网下载要使用开发版本，包含完整的警告和调试模式
在开发环境下不要使用压缩版本，不然就失去了所有常见错误相关的警告

2.CDN
3.NPM

注：前两个是小型项目的开发，最后一个是用于大型项目的开发。

vue的生命周期

总共分为四个阶段：创建、挂载、更新、销毁八个函数：
1.beforeCreate 创建前
2.create 创建后

3.beforeMount 载入前
4.mounted 载入后

5.beforeUpdate 更新前
6.updated 更新后

7.beforeDestory 销毁前
8.destroyed 销毁后

详细解释：
1.beforeCreate（创建前）: 在数据观测和初始化事件还未开始
2.created（创建后）: 完成数据观测，属性和方法的运算，初始化事件，$ el属性还没有显示出来

3.beforeMount（载入前）: 在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。注意此时还没有挂载html到页面上。
4.mounted（载入后）: 在el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。此过程中进行ajax交互。

5.beforeUpdate（更新前）: 在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重渲染过程。
6.updated（更新后）: 在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时，组件DOM已经更新，所以可以执行依赖于DOM的操作。然而在大多数情况下，应该避免在此期间更改状态，因为这可能会导致更新无限循环。该钩子在服务器端渲染期间不被调用。

7.beforeDestroy（销毁前）: 在实例销毁之前调用。实例仍然完全可用。
8.destroyed（销毁后）: 在实例销毁之后调用。调用后，所有的事件监听器会被移除，所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用。

vue目录介绍

vue的三个特点

1.数据双向绑定；
2.组件化；
3.单文件组件。

vue.js第一次加载会触发哪几个钩子函数

beforeCreate 创建前
created 创建后
beforeMount 载入前
mounted 载入后

MVVM模式

MVVM 是 Model-View-ViewModel 的缩写。
Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。
View 代表UI 组件，它负责将数据模型转化成UI 展现出来。
ViewModel 监听模型数据的改变和控制视图行为、处理用户交互

通俗点讲就是：
M 数据层
V 视图层
VM 视图模型
当M（数据）发生改变，V（视图）也会发生改变
反之，当V（视图）发生改变，V（数据）也会改变
这就是MVVM模式的双向数据绑定