这篇文章给大家聊聊关于使用Vue等框架的首要原因是为了开发效率，还是减少DOM操作的性能损失，以及vue不建议操作dom对应的知识点，希望对各位有所帮助，不要忘了收藏本站哦。
本文目录
vue好用吗
什么是Vue.js?
Vue.js是前端的主流框架之一
Vue.js是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于第三方库即有项目整合（Vue有配置的第三方类库，可以整合起来做大型项目的开发），下一节我们讲解百度地图用Vue的方式引入。
前端的主要工作：主要负责MVC中的V这一层，主要工作就是和界面打交道，来制作页面效果
什么是MVC、MVVM？
后端（JavaPythonNodec#）中的mvc与前端mvvm之间的区别：
mvc是后端的分层开发概念
mvvm是前端视图层的概念，主要关注于视图层分离，也就是说：mvvm把前端的视图层，分为三部分：model，view，vmviewmodel
『View』：视图层（UI用户界面）『ViewModel』：业务逻辑层（一切js可视为业务逻辑）『Model』：数据层（存储数据及对数据的处理如增删改查）
简述MVVM
MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model层代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑；View代表UI组件，它负责将数据模型转化成UI展现出来，ViewModel是一个同步View和Model的对象。在MVVM架构下，View和Model之间并没有直接的联系，而是通过ViewModel进行交互，Model和ViewModel之间的交互是双向的，因此View数据的变化会同步到Model中，而Model数据的变化也会立即反应到View上。ViewModel通过双向数据绑定把View层和Model层连接了起来，而View和Model之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作DOM,不需要关注数据状态的同步问题，复杂的数据状态维护完全由MVVM来统一管理。Vue的简介
声明式渲染DeclarativeRendering
组件系统Components
vue返回的是一个对象
vue是一个mvvm的框架
Vue是vue的实例，这个实例存在计算机中，主要干俩大事：1、绑定事件；2、dom检测
Vuejs是封装的一个类
Vue全家桶包括
客户端路由Vue-router大规模状态管理Vuex构建工具Webpack/Vue-cli服务端通信AxiosVue.js的优点
简单轻巧，功能强大，拥有非常容易上手的API；可组件化和响应式设计；实现数据与结构分离，高性能，易于浏览器的加载速度；MVVM模式，数据双向绑定，减少了DOM操作，将更多精力放在数据和业务逻辑上Vue的基础语法介绍
v-model:主要是在表单元素的双向数据绑定中使用。比如文本框、下拉框、单选、复选、textarea等等。因为v-model是双向绑定的，所以文本框输入以后，模型也会发生改变。反之模型改变了文本框也会改变。v-text：主要用于文本的渲染。和{{}}功能一样。但是{{}}在第一次页面Vue木没有初始化完成时，会显示{{}}字符。故文本渲染多用v-text。v-html:则会以html的方式把内容载入到界面中v-show：控制显示隐藏。不用艺v-if，使用v-show的情况下，dom是存在的。v-show通过指定CSS样式给元素添加displayblock或者displaynone进行控制。v-if：控制显示隐藏。如果if不成立，则整个dom不进行渲染，即不存在。v-bind：绑定属性。给一个dom元素添加属性。比如：在做图片的渲染过程中，如果图片的src地址是动态的，那么就可以利用v-bind去绑定src属性来实现src的赋值。v-for：循环。主要用于表格<li>标签，去循环一个数组。v-on：事件绑定。(v-on:同等于@)filter:过滤器。格式化数据。如后台返回金额19数字。页面显示：￥19.00元。component：组件。在做单页面过程中使用多些。把每一个网页做成多个组件然后拼接。起到组件复用。如页面头部底部和轮播等。为什么感觉学了vue之后编程能力下降了
这几天我也是因为一个项目而被迫使用vue，坦白的说vue和传统的网站开发思路不同，导致爱的人爱死，老程序员烦死的现状。
主要区别：
1传统方式：我们做一个网站，首先创建几个文件夹(css、js等等)，页面需要用的资源文件，都放到各自的文件夹里。然后创建若干个HTML网页，一个个链接把这些若干网页串起来就OK，网页里需要有什么事件或效果，要么用原生js要么用jqurey，去操作某个dom，实现页面变化。
调试的时候也很简单，如果静态网页，浏览器就可以直接运行调试。asp、jsp、php、.net等动态网站，简单配置一下iis或Tomcat，也就能直接调试。
2vue(这里用vue脚手架来举例)：
vue和传统最大的区别就是，vue只有一个html页面(也就是入口页面，你也可以理解成主页面)，除了主页面之外，其他的页面都是html片段，以.vue为后缀的片段文件存在，用户访问网站的时候，第一次加载完整主页面，后面的点击其实就是变化html片段而已。(和老程序员理解的局部刷新有点像)
所以vue特别适合制作手机端项目，因为它只需要根据用户的点击，加载所需的片段而已。由于不用一页一页请求新网页，所以这种机制会让手机项目运行非常丝滑顺畅。
但优点也是它的缺点，vue项目的特性决定它不适合做网站，稍微有点seo知识的人都明白，这种机制做的网站，机器人是爬不到任何内容的。
vue的部署也是让我很诟病的，部署它需要折腾一大堆事儿。首先需要安装nodejs，你可以暂时把它理解成和iisTomcat类似的网站发布容器。因为只有在nodejs下才能调试vue脚手架项目。
nodejs装完，然后在cmd命令行下，通过npm命令安装一大堆各种库插件。
这一堆事儿折腾完，你就可以通过一个命令创建一个vue脚手架，然后开始你的项目开发之旅。
很多老程序员被“vue脚手架”这个词搞得云里雾里，简单的说：上面折腾一大堆，就是为了最后敲一个命令，让系统帮你在指定位置创建一组文件夹，然后vue能用上的各种js(百十多个吧)组件都放在这各个文件里，供你开发时候调用。
对比你之前的操作，相当于：你建好文件夹，在js文件夹里放好jqurey，和你常用的js。
所以这套步骤，开始让我很不习惯，可能很多老程序员也不习惯。会让你有种“为了做个小项目，先要部署一套大工厂的感觉”。
很多老程序员其实都是做小项目出身的草根，什么百万千万的迸发、什么团队协作、前后端分离等话题，不是这类程序员关心的。他们往往即是美工也是程序员，即是前端也是后端。几乎都是以快速交付项目为第一初衷，不想为了个环境来回折腾。所以一时间适应不了vue开发模式。
另外如果你的项目，定制化程度较高。我个人还是建议采用独立html的传统方式开发。
如果是移动端开发，vue的确是最佳选择。顺便提一下，vue和小程序几乎是一摸一样的套路，会一个两个就都会了。
我也是花了2天时间，从排斥到接受的。目前用着还不错。
vue改变dom元素的顺序
Vue可以改变DOM元素的顺序。Vue可以通过v-if和v-for指令来实现改变DOM元素顺序的效果。通过v-if和v-for指令的过滤条件、变量计算和操作，可以实现元素的增、删、移动和替换来实现改变DOM元素的顺序。除了以上提到的实现方式，Vue还可以通过transition动画库、playload方式、手动计算和获取数据、借助第三方插件等方式实现改变DOM元素顺序的效果。同时需要注意，改变DOM元素顺序也会影响Vue的性能，需要根据实际需求和场景进行灵活选择和处理。
使用Vue等框架的首要原因是为了开发效率，还是减少DOM操作的性能损失
为什么要使用框架？
软件系统发展到今天已经很复杂了，特别是服务器端软件（前端也是如此），涉及到的知识，内容，非常广泛。这样开发出完善健壮的软件，对程序员的要求将会非常高。如果采用成熟，稳健的框架，那么一些基础的通用工作，比如，事物处理，安全性，数据流控制等都可以交给框架处理，那么程序员只需要集中精力完成系统的业务逻辑设计，可以降低开发难度。
从程序员角度看，使用框架最显著的好处是重用，由于框架能重用代码，因此从一已有构件库中建立应用变得非常容易，因为构件都采用框架统一定义的接口，从而使构件间的通信简单。框架能重用设计。它提供可重用的抽象算法及高层设计，并能将大系统分解成更小的构件，而且能描述构件间的内部接口。这些标准接口使在已有的构件基础上通过组装建立各种各样的系统成为可能。只要符合接口定义，新的构件就能插入框架中，构件设计者就能重用构架的设计。框架还能重用分析。所有的人员若按照框架的思想来分析事物，那么就能将它划分为同样的构件，采用相似的解决方法，从而使采用同一框架的分析人员之间能进行沟通。
结论框架的目的是为了提高工作效率，便于大规模团队协作，让开发人员更关注业务逻辑，还有就是避免一些通用问题的出现，当然，如果是高水平前端开发，某些场景直接操作dom可能代码效率更高。
因此，虽然框架是好东西，但基础的dom操作必须要学，属于必备技能。
OK，本文到此结束，希望对大家有所帮助。
