学习 Vue.js 日记（第一天 初始Vue.js）

这些是我在自学过程中所记得笔记，如果有什么错误的地方大家可以指正出来。

目录

文章目录

1.初识Vue.js

        1.1.Vue.js是什么

        1.2.关于MVVM模式和MVC模式

        1.3.框架和库的一些区别

        1.4.Vue.React的相同点

        1.5什么是虚拟DOM

1.1 Vue.js是什么

Vue.js的官方文档中是这样介绍它的。

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

Vue提供了现代Web开发中常见的高级功能，比如：

• 解耦视图与数据
• 可复用的组件
• 前端路由
• 状态管理
• 虚拟DOM（Virtual DOM)

1.2 关于MVVM模式和MVC模式

MVVM模式是由经典的软件架构MVC衍生来的

        M -->model:负责数据存储

        V --> view:负责页面的展示

        VM -->view model: 负责业务逻辑（比如Ajax请求）对数据加工后交给视图

当View变化时，会自动更新到ViewModel,反之亦然。View和ViewModel之间通过双向绑定建立联系。

MVC模式（设计模式，前后端都有）

M --> model - 模型 -->数据（js变量）

V --> view - 视图 -->用户所见界面（html,css）

C --> controller -控制 -->时间交互（如何根据视图与用户交互通过DOM对象绑定事件，将变量进行修改）

它们之间的交互都是单向的

1.3 框架和库的一些区别

像angular、vue就属于框架，而jQuery、react、underscore就是库。

框架：框架是一套完整的解决方案，对项目的入侵性比较大。项目如果需要跟换框架，则需要重新架框。

库（插件): 只是提供某一个小功能，对项目的侵入性比较小，如果某个库无法完成某个需求，可以很容易切换到其他库实现需求。

1.4 Vue.React的相同点

• 利用虚拟DOM实现快速渲染
• 轻量级
• 响应式组件
• 支持服务器端渲染
• 易于集成路由工具打包以及状态管理工具

1.5 什么是虚拟DOM

虚拟DOM就是为了解决浏览器性能问题而被设计出来的。因为他是用普通的JS对象来描述DOM结构。因为不是真实的DOM结构，所以称为虚拟DOM。

---