- 1、本文档共4页,可阅读全部内容。
- 2、有哪些信誉好的足球投注网站(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
小伙伴们,大家好。
今天由小尼老师带领大家来了解一款渐进式
JavaScript框架——Vue。
近年来,前端开发领域,旧浏览器逐渐淘汰,移动
端开发需求逐年增加,前端交互越来越多,功能越
来越复杂。架构从传统后台MVC向RESTAPI+前
端MV*迁移。
MV*相当于
MVC即:
Model(模型)表示应用程序核心(比如数据库记录列表)。
View(视图)显示数据(数据库记录)。
Controller(控制器)处理输入(写入数据库记录)。
MVP
Model(模型)表示应用程序核心(比如数据库记录列表)。
View(视图)显示数据(数据库记录)。
Presenter(表示器)负责逻辑处理业务。
与MVC差别在于:
1、View与Model完全隔离。
2、Presenter与View的具体实现技术无关。
3、可以进行View的模拟测试。
MVVM(Vue就是一种MVVM框架)
Model(模型)表示应用程序核心(比如数据库记录列表)。
View(视图)显示数据(数据库记录)。
ViewModel(观察者)负责把Model的数据同步到View显示出来,还负责把View的
修改同步回Model。
优点:高内聚,低耦合(可重用性、可移植性)。
Vue是一款数据驱动+组件化的前端开发框架,对比于Angular和React,Vue.js
更轻量,gzip后大小只有26K(Angular56K,React44K),同时更易上手,学习
曲线平稳,吸收两家之长,借鉴了angular的指令和react的组件化。
首先来看一个数据双向绑定的例子:
●当更改输入框的值时,文本的内容会被更新
●如果改变文本的内容,输入框也会更新
Vue.jsAngluar.js
Vue的组件化:
Vue的轻量级:
1.语义清晰,简单明了
绑定click事件
条件渲染
循环渲染
2.代码紧凑,解放性能
Angular.js生产版本:156kb
React.js生产版本:145kb
Vue.js生产版本:75kb
Vue.js的核心思想:
数据驱动:数据(model)改变驱动视图(view)自动更新
组件化:扩展HTML元素,封装可重用的代码
组件设计原则:
1、页面上每个独立的可视/可交互区域视为一个组件
2、每个组件对应一个工程目录,组件所需的各种资源在这个目录下就近维护
3、页面不过是组件的容器,组件可以嵌套自由组成形成完整的页面
OK,本期先介绍这么多吧,下期介绍《Vue常用指令总结》。
文档评论(0)