简单了解前端渐进式框架VUE


Posted in Javascript onJuly 20, 2020

一、前端响应式框架VUE简介

  • Vue (读音 /vjuː/,类似于 view)
  • Vue的官方网站是:https://cn.vuejs.org/
  • 是中国的大神尤雨溪开发的,为数不多的国人开发的世界顶级开源软件
  • 是一套用于构建用户界面的渐进式框架。Vue 被设计为可以自底向上逐层应用。(下文会介绍什么是渐进式框架及自底向上逐层应用的概念)
  • MVVM响应式编程模型,避免直接操作DOM , 降低DOM操作的复杂性。

简单了解前端渐进式框架VUE

MVVM:页面输入改变数据,数据改变影响页面数据展示与渲染

  • M(model):普通的javascript数据对象
  • V(view):前端展示页面
  • VM(ViewModel):用于双向绑定数据与页面,对于我们的课程来说,就是vue的实例

二、VUE核心功能

  • 基础功能:页面渲染、表单处理提交、帮我们管理DOM(虚拟DOM)节点
  • 组件化开发:增强代码的复用能力,复杂系统代码维护更简单

简单了解前端渐进式框架VUE

  • 前端路由:更流畅的的用户体验、灵活的在页面切换已渲染组件的显示,不需与后端做多余的交互
  • 状态集中管理:MVVM响应式模型基础上实现多组件之间的状态数据同步与管理
  • 前端工程化:结合webpack等前端打包工具,管理多种静态资源,代码,测试,发布等,整合前端大型项目。

三、渐进式框架

简单了解前端渐进式框架VUE

笔者理解的“渐进式框架”也非常简单,就是用你想用或者能用的功能特性,你不想用的部分功能可以先不用。VUE不强求你一次性接受并使用它的全部功能特性。

  • 场景一:公司刚开始一个项目,技术人员对Vue的掌握也不足够。那么我们就不能使用VUE了么?当然不是,如果你只是使用VUE做些基础操作,如:页面渲染、表单处理提交功能,那还是非常简单的,成熟技术人员上手也就一两天。完全可以用它去代替jquery。并不需要你去引入其他复杂特性功能。
  • 场景二:我们项目用了VUE,使用的效果也挺好。那么我们想逐渐实现代码组件化,实现代码的复用,或者是基于组件原型的跨项目的代码复用。那么我们就可以引入VUE的components组件特性了。
  • 场景三:我们的项目规模逐渐的变大了,我们可能会逐渐用到前端路由、状态集中管理、并最终实现一个高度工程化的前端项目。这些功能特性我们可以逐步引入,当然不用也可以。

所以VUE的适用面很广,你可以用它代替老项目中的JQuery。也可以在新项目启动初期,有限的使用VUE的功能特性,从而降低上手的成本。 

以上就是简单了解前端渐进式框架VUE的详细内容,更多关于前端渐进式框架VUE的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
幻宇的层模拟窗口效果-提供演示和下载
Jan 20 Javascript
javascript 操作文件 实现方法小结
Jul 02 Javascript
在网页中使用document.write时遭遇的奇怪问题
Aug 24 Javascript
多浏览器兼容性比较好的复制到剪贴板的js代码
Oct 09 Javascript
dotopAlert 提示用户需安装播放器的代码
Sep 17 Javascript
zTree插件之单选下拉菜单实例代码
Nov 07 Javascript
Javascript学习笔记之相等符号与严格相等符号
Nov 23 Javascript
jQuery中noconflict函数的实现原理分解
Feb 03 Javascript
详解MVC如何使用开源分页插件(shenniu.pager.js)
Dec 16 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
Dec 26 Javascript
js自定义Tab选项卡效果
Jun 05 Javascript
实现图片首尾平滑轮播(JS原生方法—节流)
Oct 17 Javascript
基于VSCode调试网页JavaScript代码过程详解
Jul 20 #Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
Jul 20 #Javascript
在Vue 中实现循环渲染多个相同echarts图表
Jul 20 #Javascript
解决echarts数据二次渲染不成功的问题
Jul 20 #Javascript
详细分析vue表单数据的绑定
Jul 20 #Javascript
echarts 使用formatter 修改鼠标悬浮事件信息操作
Jul 20 #Javascript
mpvue 项目初始化及实现授权登录的实现方法
Jul 20 #Javascript
You might like
图书管理程序(三)
2006/10/09 PHP
php下使用以下代码连接并测试
2008/04/09 PHP
让php处理图片变得简单 基于gb库的图片处理类附实例代码下载
2011/05/17 PHP
yii中widget的用法
2014/12/03 PHP
centos+php+coreseek+sphinx+mysql之一coreseek安装篇
2016/10/25 PHP
ThinkPHP实现登录退出功能
2017/06/29 PHP
JQuery 弹出框定位实现方法
2010/12/02 Javascript
jQuery EasyUI API 中文文档 - Tree树使用介绍
2011/11/19 Javascript
JS小游戏之宇宙战机源码详解
2014/09/25 Javascript
express的中间件basicAuth详解
2014/12/04 Javascript
Vue数据驱动模拟实现2
2017/01/11 Javascript
JS实现中文汉字按拼音排序的方法
2017/10/09 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
详解如何使用 vue-cli 开发多页应用
2017/12/16 Javascript
NodeJS服务器实现gzip压缩的示例代码
2018/10/12 NodeJs
vue+iview/elementUi实现城市多选
2019/03/28 Javascript
vue + any-touch实现一个iscroll 实现拖拽和滑动动画效果
2019/04/08 Javascript
vue cli 3.x 项目部署到 github pages的方法
2019/04/17 Javascript
Node爬取大批量文件的方法示例
2019/06/28 Javascript
微信小程序页面间传递数组对象方法解析
2019/11/06 Javascript
JS实现前端动态分页码代码实例
2020/06/02 Javascript
跟老齐学Python之复习if语句
2014/10/02 Python
Django ORM框架的定时任务如何使用详解
2017/10/19 Python
Python中import机制详解
2017/11/14 Python
python3利用Dlib19.7实现人脸68个特征点标定
2018/02/26 Python
用PyInstaller把Python代码打包成单个独立的exe可执行文件
2018/05/26 Python
Python使用一行代码获取上个月是几月
2018/08/30 Python
Python多进程池 multiprocessing Pool用法示例
2018/09/07 Python
python 去除二维数组/二维列表中的重复行方法
2019/01/23 Python
Python模拟百度自动输入搜索功能的实例
2019/02/14 Python
Django model select的多种用法详解
2019/07/16 Python
移动端html5模拟长按事件的实现方法
2018/09/30 HTML / CSS
英国著名国际平价时尚男装品牌:Topman
2016/08/27 全球购物
Urban Outfitters英国官网:美国平价服饰品牌
2016/11/25 全球购物
英国男女豪华配饰和礼品网站:Black.co.uk
2020/02/28 全球购物
各营销点岗位职责范本
2014/03/05 职场文书