vue 学前班001(基础概念)
1 学习目标
通过这一节,你会学会:
1.目前前端技术使用的趋势
2.什么是MVVM
3.Vue.js的两大核心
4.Vue.js的适用场景
诞生背景
近几年来,得益于手机设备的普及和性能的提升,移动端的web需求大量增加,产生了一种叫webapp的东西,也就是移动端的网页应用。
它们功能越来越复杂,交互也越来越酷炫,功能与效果越来越接近于原生的APP。
但是打开会有等待 用户体验不好 a标签链接需要等待 所以 为了解决这个 vue 开发 模式诞生了 另外还有最近你很多的 apicloud + vue + aui 的开发 虽然 有很多问题 但是用户体验 变的更好了 (废话不多说 先看vue 吧)
什么是MVVM
MVVM可以拆分成:View --- ViewModel --- Model三部分 ,看下面的视图:

那么,我们怎么理解MVVM呢?
上图中,左侧的View相当于我们的DOM内容,我们所看到的页面视图,右侧的Model相当于我们的数据对象,比如一个对象的信息
name: 张三
age:21
而中间的监控者就负责监控两侧的数据,并相对应地通知另一侧进行修改。比如:你在Model层中修改了name的值为:“李四”,那么View视图层显示的“张三”也会自动变成了“李四”,而这个过程就是有ViewModel来操作的,不需要你手动地去写代码去实现(你不用再手动操作DOM了)。
Vue的核心
Vue的数据驱动:数据改变驱动了视图的自动更新,传统的做法你得手动改变DOM来改变视图,vuejs只需要改变数据,就会自动改变视图,一个字:爽。再也不用你去操心DOM的更新了,这就是MVVM思想的实现。
视图组件化:把整一个网页的拆分成一个个区块,每个区块我们可以看作成一个组件。网页由多个组件拼接或者嵌套组成。看下图:

4 适用场景
如果你还在用jquery频繁操作你的DOM来更新页面的话,那么,你可以用Vue.js来解放你的DOM操作了。
如果你的项目中有多个部分是相同的,并可以封装成一个组件,那么,你可以试试用Vue.js。
此外,Vue.js的核心实现中使用了ES5的Object.defineProperty特性,IE8及以下版本浏览器是不兼容的,所以,你的项目需要兼容这些较低版本的浏览器的话,那么,Vue.js就不适用了。
毕竟,开发一个项目的目的不是为了使用某个框架。
vue 学前班001(基础概念)的更多相关文章
- vue初学:基础概念
一.vue使用步骤: 1.引包vue.js 2.html中写要操作的DOM节点 3.创建vue对象:new Vue({options}); 4.配置options:el:(要操作的对象,用选择器,同j ...
- 计算机系统4-> 计组与体系结构1 | 基础概念介绍
在大二上学期学习数字逻辑的过程中,我对计算机如何运作产生了兴趣,因此开了这个系列来记录自己在这方面的学习过程,此前三篇分别是: 计算机系统->Hello World的一生 | 程序如何运行,从大 ...
- 【Machine Learning】机器学习及其基础概念简介
机器学习及其基础概念简介 作者:白宁超 2016年12月23日21:24:51 摘要:随着机器学习和深度学习的热潮,各种图书层出不穷.然而多数是基础理论知识介绍,缺乏实现的深入理解.本系列文章是作者结 ...
- TCP/IP基础概念及通信过程举例
TCP/IP基础概念及通信过程举例 出现 上个世纪60年代,由于中央集中式网络的容灾性较弱,以美国国防部为中心的一家组织研究出分组交换网络.后来为了验证分组交换技术的实用性,ARPANET出现了,并且 ...
- Jmeter基础之---jmeter基础概念
Jmeter基础之---jmeter基础概念 JMeter 介绍: 一个非常优秀的开源的性能测试工具. 优点:你用着用着就会发现它的重多优点,当然不足点也会呈现出来. JMeter 介绍: 一个非常优 ...
- 快速入门系列--WCF--01基础概念
转眼微软的WCF已走过十个年头,它是微软通信框架的集大成者,将之前微软所有的通信框架进行了整合,提供了统一的应用方式.记得从自己最开始做MFC时,就使用过Named Pipe命名管道,之后做Winfo ...
- 理解 angular2 基础概念和结构 ----angular2系列(二)
前言: angular2官方将框架按以下结构划分: Module Component Template Metadata Data Binding Directive Service Dependen ...
- JavaBean 基础概念、使用实例及代码分析
JavaBean 基础概念.使用实例及代码分析 JavaBean的概念 JavaBean是一种可重复使用的.且跨平台的软件组件. JavaBean可分为两种:一种是有用户界面的(有UI的):另一种是没 ...
- RabbitMQ基础概念详细介绍
http://blog.csdn.net/column/details/rabbitmq.html 转至:http://www.ostest.cn/archives/497 引言 你是否遇到过两个(多 ...
随机推荐
- 类里面的非static const成员
类里面的成员变量可以用const修饰,在只用const不用static修饰的情况下,这种使用的限制比较多 (1)不能定义处初始化,必须在类的构造函数初始化列表里面初始化(虽然在vs中,可以在定义处初始 ...
- oracle 用一个表的一个字段更新另一个表的一个字段
案列: 想更新A表的name字段,由于失误,在写这个表的时候,这个字段没有写,发现的时候,已经写了一个多月的数据了.改了之后的过程,会正常的写这个字段, 可是已经写了的数据也不能铲了,重新计算. 好在 ...
- 2018.10.16 NOIP模拟 长者(主席树+hash)
传送门 考试的时候开始sb的以为需要可持久化trietrietrie树,发现建树时空都是O(n2)O(n^2)O(n2)的. 然后发现由于每次只从原来的字符串改一个字符. 因此直接主席树维护区间has ...
- 基于DDD的现代ASP.NET开发框架--ABP系列文章总目录(转)
出处:http://www.cnblogs.com/mienreal/p/4528470.html ABP相关岗位招聘:给热爱.NET新技术和ABP框架的朋友带来一个高薪的工作机会 ABP交流会录像视 ...
- JPEG Camer 图片上传
/* Linksprite */ #include <SoftwareSerial.h> #include <Ethernet.h> #include <SPI.h> ...
- Linux学习--2
字符串 字符串可以用单引号,也可以用双引号,也可以不用引号.单双引号的区别跟PHP类似 单引号字符串的限制:单引号里的任何字符都会原样输出,单引号字符串中的变量是无效的:单引号字串中不能出现单引号(对 ...
- 如何更改myecelipse、eclipse的Project Explorer的背景颜色
这个是我研究了很久发现的,因为myecelipse.eclipse本身是随着系统的颜色改变而改变的,windows系统都会随着系统改变而改变的,所以找了很多资料都没能改变它的背景色,今天发现了一个不错 ...
- MODIS产品分析和数据处理
ENVI+IDL 17种MODIS产品的功能解释 https://wenku.baidu.com/view/6fd329dcf524ccbff0218440.html ENVI读取MODIS数据大致步 ...
- 20155302 2016-2017-2 《Java程序设计》第六周学习总结
20155302 2016-2017-2 <Java程序设计>第6周学习总结 教材学习内容总结 Java中的流分为两种,一种是字节流,另一种是字符流,分别由四个抽象类来表示(每种流包括输入 ...
- CDialog类
CDilalog包含三个关键函数:OnInitDialog.OnOK和OnCancel,可以覆盖这三个函数初始化对话框.响应点击OK和Cancel按钮.尽管每个函数都响应一条对话框消息,但是不需要你提 ...