Vue.js 2.0 渐进开发应使用实践

作者 : 开心源码 本文共1118个字,预计阅读时间需要3分钟 发布时间: 2022-05-11 共69人阅读

内容

导读:为什么要使用 Vue.js

用任何新框架和库其实都是为理解决我们当前开发所遇到的问题,或者者能提升其开发效率。每个人的成本就是时间,好的工具则能够帮助我们节约时间,从项目角度而言,也就帮我们节约了成本。而 Vue.js 就是一款能降低开发成本、提升开发效率的工具,它能帮助我们从繁琐的 DOM 操作中解脱出来。开发中,我们设定好正确视图和数据的规则后,只要要关注数据的变化,视图上的内容是会随之变化的,而不需要我们手动再操作 DOM 元素进行修改。

此外,前台开发的模式也逐步开始往组件化方向转变,Web Components 的概念也开始逐步成为标准,拥有自己独立的 HTML 片段、JS 文件以及 CSS 样式,这样在用时可以不使用担心对自己本身业务上的代码造成影响。Vue.js 对这一概念也进行了自己的实现,这样对于提升代码复使用、拆解大型项目,都有着很好的帮助。

兼容性

Vue.js 不支持 IE8 及其以下版本,由于 Vue.js 用了 IE8 不能模拟的 ECMAScript 5 特性。Vue.js 支持所有兼容 ECMAScript 5 的浏览器。

内容列表

本系列将从零开始详情 Vue.js,内容安排如下:

  • Vue 的基础概念及构建开发环境
  • 网页开发的基础内容:数据渲染、事件绑定和表单解决
  • 提升代码复使用性(1):指令和组件
  • 提升代码复使用性(2):混合属性、过滤器、过渡和插件
  • 开发线上项目必经过程:前后台联调及打包发布
  • 数据请求、文件上传、处理跨域问题
  • 第三方库与业务代码分离、多页面分离资源引使用
  • 单页应使用的基础:vue-router
  • 路由公告及用
  • 利使用导航守卫实现权限控制
  • 路由优化:解耦与按需加载
  • 组件间通信及构建大型应使用所需的状态管理:Vuex
  • Vuex 的基本使用法
  • Vuex 的常见用技巧
  • 实战:日历式的 TODO List
  • 提升 SEO 和加快首屏显示时间:服务端渲染
  • 预渲染
  • 服务端渲染官方库:vue-server-renderer
  • 服务端渲染框架:Nuxt.js
  • 编写高质量的 Vue 项目:测试使用例
  • Karam + Mocha:单元测试
  • Nightwatch:E2E 测试

期望能使帮助开发者快速掌握 Vue.js,理解其用方式和用场景,并构建可上线的真实项目。

适合阅读人群

本系列的文章适合以下人群阅读:

  • 对 Vue.js 感兴趣但尚未用的前台开发者;
  • 对 Vue.js 处于试验阶段但尚未正式上线或者用规模还不大的开发者。

版本商定

本系列内容采使用 Vue.js 版本为 2.5.6,大部分代码都会用 ES6,希望读者对 ES6 有肯定的理解。

第01课:Vue 的基础概念及构建开发环境

数据与视图

Vue.js 最大的特点之一就是数据驱动视图,也就是说当数据发生变化时,视图(即可使用户界面)也随之发生变化,而不需要我们手动去升级 DOM 元素。

Vue.js 2.0 渐进开发应使用实践

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » Vue.js 2.0 渐进开发应使用实践

发表回复