【Vue】为什么要使用vue

最新推荐文章于 2023-03-15 21:45:55 发布

StudiousTiger

最新推荐文章于 2023-03-15 21:45:55 发布

阅读量3.5k

点赞数 3

分类专栏： Tiger の Vue 文章标签： vue 设计模式

本文链接：https://blog.csdn.net/m0_45067620/article/details/118677904

版权

8 篇文章 1 订阅

订阅专栏

一、vue是什么

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。采用的是MVVM设计模式。

与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

二、vue的优点

三、什么是MVVM设计模式

MVVM（Model-View-ViewModel），它本质上是MVC的改进版，是针对MVC中的View进行了更细致的分工。
在这里插入图片描述

添加了ViewModel层，ViewModle将视图UI和业务逻辑分开，它可以取出Model的数据，同时帮助处理View中由于需要展示内容而设计到的业务逻辑。

优点：

低耦合。视图（View）可以独立于Model变化和修改，一个ViewModel可以绑定到不同的"View"上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。
独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计。
可测试。界面素来是比较难于测试的，测试可以针对ViewModel来写

MVVM的组成部分：

四、什么是数据驱动（双向数据绑定）

数据模型和视图之间的双向绑定。
在这里插入图片描述

当数据发生变化的时候，视图也就发生变化，当视图发生变化的时候，数据也会跟着同步变化。
可以这样说用户在视图上的修改会自动同步到数据模型中去，数据模型也是同样的变化。

优点：
无需和单向数据绑定那样进行CRUD（Create，Retrieve，Update，Delete）操作，双向数据绑定最常应用在就表单上，这样当用户在前端页面完成输入后，用户不用任何操作，我们就已经拿到了用户输入好的数据，并放到数据模型中了。

五、什么是虚拟DOM

虚拟Dom可以看做一棵模拟了DOM树的JavaScript对象树。虚拟DOM其实就是一种模拟DOM的JavaScript数据结构。

工作原理（简述）：
虚拟DOM是用JS对象记录一个dom节点的副本，当dom发生更改时候，先用虚拟dom进行diff，算出最小差异，然后再修改真实dom。

在没有虚拟dom的时期，当dom发生更改时候，浏览器会从构建DOM树开始从头到尾执行一遍流程，效率很低。话句话上，即使原本没有发生改变的结构也会被重新的渲染一遍。

相比于传统的dom操作，虚拟dom的性能更加的好。

好处：

保证性能下限：参考上述的工作原理。
无需手动操作DOM：我们不再需要手动去操作 DOM，只需要写好 View-Model 的代码逻辑，框架会根据虚拟 DOM 和数据双向绑定，帮我们以可预期的方式更新视图，极大提高我们的开发效率。
跨平台：虚拟 DOM 本质上是 JavaScript 对象，与平台弱相关，而 DOM 与平台强相关。相比之下虚拟 DOM
可以进行更方便地跨平台操作。

爱，或者被爱，都不如相爱，与知识相爱…
请添加图片描述

关注