vue2.0实战案例之高级教程-老孟编程

vue2.0实战案例之高级教程

008：vue.js前端框架安装和使用范围。
vue版本升级和使用方式，vue和jquery.js,和zepto.js的优劣势分析。
vue为什么无法在开发小程序里无法使用，Windows对象分析。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。


009：vue各种基础指令使用技巧
vue.js是什么，vue.js的声明式语法，条件与循环，from表单渲染语法。


010: v-model实际使用案例，开发登录页面
登录界面的v-model绑定或渲染数据，实际流程分析。


011：v-if,v-bind实战使用案例，典型登录页面的逻辑实现。
v-bind:class，v-if else,执行流程分析。
vue实现典型的登录页面效果，模仿当当，京东登录效果，根据用户的输入监听登录按钮和可操作行为。
在实际项目开发中可以直接参考，拿来用。


012：v-for的高级使用，实战使用案例，典型的列表页面的逻辑实现
结合传统list页面，来对v-for进行实际项目中的渲染，模拟今日头条的数据列表来实行，加深对v-for的灵活使用。
v-for实现下拉刷新，上拉加载实现。
在开发当当网商城项目中，商品列表，订单列表等等v-for的使用无处不在。


013：v-on:click()的高级使用，典型购物车列表页面删除，添加操作
v-on:click结合v-for使用，绑定list中每一条数据，删除list中的某一条，n条数据操作，
使用场景为订单list中，删除一条订单。购物车删除一条数据等等在操作list的使用。
vm.list删除一条数据后指针的变化，vm对象会对指针进行重置。
特别强调，vm对象中关于this关键词的使用。


014：vue之$watch()的高级使用场景之下拉菜单
$watch()的使用原则和场景，能用但不能滥用，主要使用场景为。
当click事件监听不到的时候而又不得不观察某个变量的变化，重点是配合下拉菜单操作来使用。


015: vue之form表单绑定实际案例
普通文本插值，单选绑定，多选绑定，修饰符之 .number, .trim的使用技巧。
特别强调；文本区域插值( ) 并不会生效，应用 v-model 来代替。
vue组件模式不适合于APIcloud开发app，APIcloud在打包的过程中会影响vue的组件化，建议用原始引入的方式来使用vue。


016：vue的ajax类库vue-resource的引入使用上，vue-ajax的使用案例
vue-resource的下载和引入，怎么看文档，和测试代码。
目前git上的vue-resource其实是兼容vue1.0和vue2.0的，都是可用得。
结合数据列表页面和api接口数据，实战引入vue-resource的操作。
vue-resource提供ajax组件默认是没有解决跨域问题的，需要自行处理或则后台开发人员做服务端的跨域处理。


017：vue的ajax类库vue-resource的引入使用下，vue-ajax的使用案例
vue-resource ajax 跨域跳过的坑，php版本的问题，导致我们写的php接口代码没有生效。
特别强调：php版本也是需要测试，选一个稳定的版本。
回调接受参数的固定写法
var ret = JSON.parse(response.data);得到api返回的完整json数据


018：vue之ajax加载数据loading框组件引入
自动给vue-resource的ajax请求添加loadingbar。
每一个ajax请求，都应该有一个加载框或者等待图标，更友好的引导用户，更好的用户体验。
默认请求时间超过300毫秒才显示，可以手动配置延迟的时间


019：vue之Filters过滤器使用，格式化Linux时间戳
针对api接口返回的linux时间戳，利用filters过滤器，格式化成我们想要的样式。


020：vue之mounted取代apiready(),原生js与jquery文档加载完毕的写法
vue之mounted()取代apiready(),原生JS与jQuery文档加载完毕的写法
能用vm变量的时候，我们不用this关键字，容易和其他类库污染，引起this指针的迁移。


021：vue之get方法，set方法，典型的全选单选代码实现
vue之get方法，set方法，实现典型的全选单选代码实现，set()，get()方法相当于自动触发行为，比较实用，做很多业务层面的逻辑。


022：vue1.0版本项目升级2.0版本跳过的坑
1：作用域的更改和性能提升
2：v-for循环变量和索引的坑
3：$index的废弃


023：Gulp配置和node.Js的安装,构建本地小型http服务器+自动刷新技术
何为前端自动化、和前端自动化的意义
Gulp环境配置-和node.Js的安装
构建本地小型http服务器+自动刷新
Gulp 多屏自动刷新技术


024：vue之页面tab选项卡效果实现
v-for和v-bind:class配合使用来实现


025：vue引入Layer-Mobile框架
场景包括：信息框，提示层，询问框，页面层，底部对话框，底部提示，loading带文字，自定义标题风格等等。






前端开发人员


快速使用vue框架开发简单的项目


老孟学堂教育总监：资深架构师，高级php开发工程师。
精通php+mysql后台系统开发，thinkphp社区有开源的系统发布。apicloud，decloud开发app方面有独到的见解，主要开源项目有蚂蚁订货系统。




孟老师带你100分钟搞定vue入门。
vue.js是一套构建用户界面的 渐进式框架，与其他重量级框架不同的是，vue 采用自底向上增量开发的设计。
vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，vue 完全有能力驱动采用单文件组件和 vue 生态系统支持的库开发的复杂单页应用。
尤其vue在webapp开发的过程中发挥着巨大的优势。
技术交流群：495654168