vue介绍

#vue介绍

vue介绍

介绍

(vue官网)[https://cn.vuejs.org/]国人尤雨溪创建。15年起短短两年发展起来，github从1k start到70k。到目前150k
侧重view层。基于js es5语法。渲染性能较好。
argular 出现到最早到，企业级，语法传统，学习成本略高，国内用户较少。
react 也比较流行。国内跟view分庭抗礼。

Vue及其生态

vue.js: 核心功能
vue-cli:脚手架 。 类似express-generator
vue-loader: scss sass less atylus等css预处理语言的编译器。
vue-router:路由。 类似express app.get(’/'function(){})
vuex:组建状态管理工具。
vue-devtools:开发者工具，方便调试。
webpack:打包工具。项目拆分和整合

MVC架构和MVVM

MVC:model模型、view视图、controler控制器
代表框架 java ssh 、python django、nodejs express(MTV)
以express框架为例：model指数据库结构， controle指路由控制分发 app.get(’/index’,function(req,req){}),
view function(req,res){res.render(‘xx.ejs’,{students:[]})}
优点，数据流向清晰。缺点，html代码从后端返回，前后端未分离，渲染重复耗时；分层太细，小项目麻烦，c层配置麻烦。
单向数据流:用户 - request - C层路由分发 - M取数据 - V视图模板 - response - 用户

MVVM: model ←→ view view → model
双向绑定数据流： model ←→ view ←→ 用户
优点，MV层映射建立后，用户只用操作外部接口，只用跟v层做交互，不需关注底层细节。

单页应用

SPA: single page
例如企业官网，顶部导航每个目录链接一个新页面，传统的多页。如果是中小企业，为了简洁，可以一个页面。
单页例如
多页例如
express框架，每个路由render一个页面，也是多页。

这里说的单页不侧重网页到底写成单页还是多页，侧重开发模式的变化。
因为现代软件项目越来越复杂和nodejs出现后有后端灵活能力。html/css/js越来越难以开发(几十html页面，数个js文件每一个js几千行) 。
利用nodejs的编程能力，变量、方法、模块化，把重复的html代码抽出来，把复杂的前端文件html/css/js分成多个脚本开发，开发完后再
合并成编译build成一个完整的distribute分发 index.html/main.css/main.js。跳转功能靠div 的id值和url #，vue-router。
最终代码文件看似一个网页，实现无刷新，部署和分发服务器更加简单。 缺点：不太利于搜索引擎爬虫。

vue版本选择

1.x 14年 现在几乎已见不到，老项目也极少。
2.x 2.0.x - 2.6.x 大量使用。2.3.x跟2.0.x个别语法不太一样
3.x 19-20年 正在开发，即将发布正式版。
vue框架流行、版本更新快速，学习应注意原理，以防版本变了就不会了。