Vue.js简称Vue,用于构建用户界面的渐进式框架。  

  Vue是一款国产前端框架,它的作者尤雨溪(Evan You)是一位美籍华人,2014年2月,尤雨溪开源了一个前端开发库 Vue.js,2015年发布1.0.0版本,2016年4月发布2.0版本,目前,尤雨溪全职投入 Vue.js 的开发与维护,立志将 Vue.js 打造成与 Angular/React 平起平坐的世界顶级框架。

  vue使用的是html编码的。因为Vue是一款流行的JavaScript前端框架,旨在更好地组织与简化Web开发。Vue.js,或简称为Vue,是一个用于创建用户界面的开源JavaScript框架,也是一个创建单页应用的Web应用框架,他的底层是html语言和js语言和css语言组成的,所以当然是html的编码的。

  Vue,读音是/vju:/,是一套用于构建用户界面的渐进式框架,自底层向上应用,Vue的核心库只关注视图层,容易入门,可以和第三方库或者已有的项目进行整合,可以做复杂的单页应用。简单的说,vue是一套前端的开发框架,vue、react、angular是前端开发的三驾马车,其中vue在国内非常流行,拥有庞大的使用群体、技术资源和生态资源,为后期学习vue的人填坑铺路,同时也在使用和升级方面形成良性循环,成为无论是前端UI还是后端工程师都要学习和掌握的对象。

  Vue.js的优点:

    易用:现成的官方文档

    灵活:渐进式框架

    高效:超快虚拟DOM

  Vue.js的核心:

    数据驱动:将操作DOM转变成操作数据

    组件化:扩展HTML元素,封装可复用diamante。

  

  Vue采用的是MVVM框架:

    MVVM是Model-View-ViewModel的简写。它本质上就是MVC的改进版,其核心思想是响应式编程模型。      

      Model 层: 对应数据层的域模型,它主要做域模型的同步。通过 Ajax/fetch 等 API 完成客户端和服务端业务 Model 的同 步。在层间关系⾥,它主要⽤于抽象出 ViewModel 中视图的 Model 。
      View 层: 作为视图模板存在,在 MVVM ⾥,整个 View 是⼀个动态模板。除了定义结构、布局外,它展示的是 ViewModel 层的数据和状态。 View 层不负责处理状态, View 层做的是 数据绑定的声明、 指令的声明、 事件绑定的声明。
      ViewModel 层: 把 View 需要的层数据暴露,并对 View 层的 数据绑定声明、 指令声明、 事件绑定声明 负责,也就是处 理 View 层的具体业务逻辑。 ViewModel 底层会做好绑定属性的监听。当 ViewModel 中数据变化, View 层会得到更 新;⽽当 View 中声明了数据的双向绑定(通常是表单元素),框架也会监听 View 层(表单)值的变化。⼀旦值变 化,View 层绑定的 ViewModel 中的数据也会得到⾃动更新。
    

  MVVM 的优缺点 ?
  优点:
    1. 分离视图(View)和模型( Model ) , 降低代码耦合,提⾼视图或者逻辑的重⽤性 : ⽐如视图(View)可以独⽴于 Model变化和修改,⼀个 ViewModel 可以绑定不同的 "View" 上,当 View 变化的时候 Model 不可以不变,当 Model 变化 的时候View 也可以不变。你可以把⼀些视图逻辑放在⼀个 ViewModel ⾥⾯,让很多 view 重⽤这段视图逻辑。
    2. 提⾼可测试性 : ViewModel 的存在可以帮助开发者更好地编写测试代码。
    3. ⾃动更新 dom: 利⽤双向绑定 , 数据更新后视图⾃动更新 , 让开发者从繁琐的⼿动 dom 中解放。
  缺点:
    1. Bug 很难被调试 : 因为使⽤双向绑定的模式,当你看到界⾯异常了,有可能是你 View 的代码有 Bug ,也可能是 Model 的代码有问题。数据绑定使得⼀个位置的Bug 被快速传递到别的位置,要定位原始出问题的地⽅就变得不那么容易 了。另外,数据绑定的声明是指令式地写在View 的模版当中的,这些内容是没办法去打断点 debug 的。
    2. ⼀个⼤的模块中 model 也会很⼤,虽然使⽤⽅便了也很容易保证了数据的⼀致性,当时⻓期持有,不释放内存就造 成了花费更多的内存。
    3. 对于⼤型的图形应⽤程序,视图状态较多, ViewModel 的构建和维护的成本都会⽐较⾼。

vue全家桶进阶之路1:前言的更多相关文章

  1. Vue 全家桶 + Electron 开发的一个跨三端的应用

    代码地址如下:http://www.demodashi.com/demo/11738.html GitHub Repo:vue-objccn Follow: halfrost · GitHub 利用 ...

  2. Vue全家桶介绍

    一直不清楚全家桶是什么玩意,上网搜了一下,才知道就是平时项目中使用的几个依赖包,下面分享一下 Vue 全家桶介绍 Vue有著名的全家桶系列,包含了vue-router(http://router.vu ...

  3. [在线+源码]vue全家桶+Typescript开发一款习惯养成APP

    # vue-ts-daily 基于Vue.js的2.5.13版本和TypeScript编写的模仿原生应用的WebApp. [源码地址](https://github.com/xiaomuzhu/vue ...

  4. vue证明题一,vue全家桶的构成

    简单说下vue的构成,当然是简单为主,网上这东西满天飞,简单说几句就ok 1.vue是什么 vue读作view,是一种js框架.只关注于视图层,操作内容包括js,html,css 2.vue全家桶是什 ...

  5. 用 Vue 全家桶二次开发 V2EX 社区

    一.开发背景 为了全面的熟悉Vue+Vue-router+Vuex+axios技术栈,结合V2EX的开放API开发了这个简洁版的V2EX. 在线预览 (为了实现跨域,直接npm run dev部署的, ...

  6. Vue全家桶

    简介 “简单却不失优雅,小巧而不乏大匠”. Vue.js 是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架.它是以数据驱动和组件化的思想构建的,采用自底向上增量开发的设计. 为什么 ...

  7. 从零开始系列之vue全家桶(3)安装使用vuex

    什么是vuex? vuex:Vue提供的状态管理工具,用于同一管理我们项目中各种数据的交互和重用,存储我们需要用到数据对象. 即data中属性同时有一个或几个组件同时使用,就是data中共用的属性. ...

  8. 使用vue全家桶制作博客网站

    前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用vue全家桶制作的博客网站 概述 该项目是基于vue全家桶(vue.vue-router.vuex.v ...

  9. 转载: 使用vue全家桶制作博客网站 HTML5 移动网站制作的好教程

    使用vue全家桶制作博客网站   前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用vue全家桶制作的博客网站 概述 该项目是基于vue全家桶(vue. ...

  10. 一个简单的假vue全家桶(vue+vue-router+require)

    首先说明我觉得这是一个比较好理解的vue全家桶(虽然是假的),模块化也是用require来做的,而且如果后期有必要压缩我也会用gulp来做 1.依赖个个本地模块,require只是用来载入page,这 ...

随机推荐

  1. 解决手机浏览器上input 输入框导致页面放大的问题

    加入以下代码在head 区,可解决此问题 <meta name="viewport" content="width=device-width, initial-sc ...

  2. win10试安装docker部署hyperf

    一:部署虚拟机,这里使用的win系统带的Hyper-V虚拟机,其它虚拟机也行 1.win+R打开命令行 2.安装Hyper-V . 失败放弃安装,选择其它吧 3.win10安装VMware 这里参考 ...

  3. 记一次 .NET某汽车零件采集系统 卡死分析

    一:背景 1. 讲故事 前段时间有位朋友在微信上找到我,说他的程序会出现一些偶发卡死的情况,让我帮忙看下是怎么回事,刚好朋友也抓到了dump,就让朋友把 dump 丢给我,接下来用 windbg 探究 ...

  4. CSP-S划分 解题报告

    n <= 10 爆搜即可 n <= 50 什么乱搞 n <= 400 有一个 \(n^3\) 的 dp 设 dp[i][j] 表示最后一段为 j+1~i 时的最小值 直接三层循环转移 ...

  5. 学习ASP.NET Core Blazor编程系列三十——JWT登录(4)

    学习ASP.NET Core Blazor编程系列文章之目录 学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应 ...

  6. java 面向对象 --static

    java 面向对象 --static package charpter5.Demo09; //static public class Student { private static int age; ...

  7. 本地搭建Stable-Diffusion 教程

    前置条件 有一些python的基础 会使用git 有梯子(最好可以全局代理) Windows系统 + 英伟达1060以上显卡 (mac或者linux 以及电脑是AMD显卡,安装的话,可以自行搜索相关教 ...

  8. C++ 用户输入验证

    在编写程序时,请考虑用户将如何滥用您的程序,尤其是在文本输入方面.对于每个文本输入点,请考虑: 会不会提取失败? 用户可以输入比预期更多的输入吗? 用户可以输入无意义的输入吗 用户可以溢出输入吗? 以 ...

  9. Spring竟然可以创建“重复”名称的bean?—一次项目中存在多个bean名称重复问题的排查

    作者:京东科技 韩国凯 一.项目中存在了名称重复的bean 众所周知,在Spring中时不能够创建两个名称相同的bean的,否则会在启动时报错: 但是我却在我们的spring项目中发现了两个相同名称的 ...

  10. iOS 深色模式适配

    要求:iOS13.0以上 重点:需要所有界面进行适配,工作量巨大,需要从项目开始就进行适配:H5界面无法进行适配 实现方式:System Colors(常用).Semantic Colors(常用). ...