一.关于Vue的介绍
1.什么是Vue
渐进式JavaScript框架,js是页面脚本语言,用来控制或是辅助页面搭建,js功能的集合体
vue可以控制一个页面中的一个标签
vue可以控制一整个页面
vue可以控制整个项目
js控制页面-需要在页面script引入js =>vue项目只有一个页面 =>组件化开发
2.Vue的优点
三大前台框架:Angular React Vue
vue:综合前两个框架的优点(轻量级)、一手文档是中文(上手快)、vue完全开源(免费)
单页面web应用 - 服务于移动端 - 客户端只需要问后台索要数据
MVVM设计模式
数据驱动 - 区别于DOM驱动(DOM加载后才能操作) - 在缓存中根据数据处理dom,再渲染给真实dom
虚拟dom - 页面的缓存机制
数据的双向绑定 - 页面中变量相同,数据就相同,实时被检测
3.MVVM的设计模式
一、MVVM是基于组件开始、数据驱动的
说到MVC或MVP,可能大家都是熟悉的,因为MVC或MVP都是基于面向对象的设计模式;而MVVM是基于组件,数据驱动的设计模式。
正是这一区别,造成大家对于MVVM学习起来比较费力,因为一开始姿势就不正确。
大家了解到这一原因之后,再去了解一下组件式开发和数据驱动,学习起来会舒服很多。
二、MVVM的优点
1. 低耦合。视图(View)可以独立于Model变化和修改,一个ViewModel可以绑定到不同的"View"上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。
2. 可重用性。你可以把一些视图逻辑放在一个ViewModel里面,让很多view重用这段视图逻辑。
3. 独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计。
4. 可测试。界面素来是比较难于测试的,而现在测试可以针对ViewModel来写。
三、MVVM配合一个绑定机制效果最好
大家应该注意到了第一点的组件式开发和数据驱动以及第二点中的所有优点。
没错,就是用过CocosCreator或Unity引擎的同学写的游戏基于都是基于MVVM设计模式来开发的。
可能大家还没意识到这一点,所以现在大家用以上引擎工作的同学,更应该学习MVVM,以后的代码以MVVM模式思维来开发,代码的健壮性、可读性、可复用性会更加好。
最后,还有一点,MVVM分为M、V、VM。
大家用CCC或Unity的时候,VM就是大家写的脚本逻辑,V就是项目中的数据。
然后M呢?其实M就是我们看到的可视化界面或者说是Node,引擎已经帮我们做好M了。