vue基础

1.认识vue

1.1什么是vue?

vue.js 是一套构建用户界面的渐进式框架.

vue是一款友好的,多途径且高性能的JavaScript框架,可维护和测试更强的代码

Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API。

1.2 了解库和框架

1. 框架 vue:

   拥有一个完整的解决方案.,我们开发好以后,他就能调用我们的代码

   vue的核心就是库, 使用他vue核心库和一些插件就是框架.

   2. 库 jQuer

   库是别人开发好以后,我们去调用库的方法

为什么我们需要js框架? 下面我们简单列举一下框架的优势:

• 高效: 一些任务可能需要花费你数个小时,几百行代码,而现在只需要几行代码就能完成.开发变得,简单,快速,而且高效.
• 安全: 许多的框架都拥有安全的实现。最大的优势在于强大的社区支持。
• 成本: 许多框架都是免费的,并且开发人员编写代码更快, 所以客户成本自然更低;
• 支持: 和其它的发布工具类似，框架也有文档支持，团队支持，或者大的社区能迅速帮你解决问题

vue上手很简单,门槛很低. 可以帮助web开发者快速构建动态web用户页面

1.3 vue的特点

1. 遵循MVMM模式(m -> model)对象, v -> 视图 vm -> view model
2. 编码简洁,体积小. 远行效率高, 适合移动/PC开发
3. 核心只关注视图层, 可以轻松引入vue插件或第三方库开发项目
4. 易学,轻量,灵活的特点
5. 渐进式框架

1.4 渐进式的理解

通过组合,可以完成一个完整的框架,

通俗的来说,渐进式,就是vue有一个核心库, 和一堆的插件, 当核心库能完成的内容就用核心库就行了, 如果需要什么插件在下载什么插件使用.渐进式代表的含义:主张最少.

Vue全家桶 vue.js + vue-router + vuex + axios + element-ui

1. 声明式渲染(不关心是如何实现的知道怎么用就可以了)
2. 组件系统( 大型项目, 很多部分可以复用, 这就是组件)
3. 客户端路由(vue-router)
4. 大规模状态管理(vuex)
5. 构建工具 (vue-cli)

1.5 MVC模式

1. MVC单向

   model 模型 view 视图 controller 控制器

[图片上传失败...(image-f2ef47-1599144771556)]

2.MVVM双向

​ model 视图 view 视图 view model 视图模型

img

• Model 视图模型 数据和业务逻辑都在Model层中定义；
• View 视图层, 负责视图的显示
• View Model 负责监听Model中数据的改变并且控制视图的更新, 处理用户交互的操作

Model和view并未关联, 他们通过View Model来进行联系, Model和View Model之间有着双向数据绑定的联系.所以每当Model

中数据发生改变时会触发视图层View的更新. View中由于用户交互操作而改变的操作也会在Model中同步更新.

这种开发模式,实现了Model和VIew的数据自动同步, 开发者只需要专注对数据的维护操作即可,而不需要自己操作dom;