如何封装.ppt

转正答辩 内容 01 02 03 自我介绍 工作内容 未来计划 一：自我介绍 张琦，陕西武功人，渭南师范学院网络工程专业 自学半年，已基本掌握HTML，CSS，JS，JQ。个人比较喜欢CSS 爱好比较广泛 内容 01 02 03 信息安全与工作准则 封装WCloud首页panel 二次封装横向柱状图 二：工作内容 内容 04 05 06 统计用户页面停留时间 重构设置参数页面 绘制市场空间页面 二：工作内容 工作内容 01 02 03 信息安全与工作准则 封装WCloud首页panel 封装横向柱状图 04 统计用户页面停留时间 05 重构设置参数页面 01 信息安全与工作准则 信息安全： 存储介质，邮箱，代码，违规操作 工作准则： 工卡，时间，交付原则，风险预估 02 封装Wins_Cloud首页panel 为什么要封装？ 如何封装？ 1.提取不变的前端配置项 2.提取定制的前端配置项 3.提取页面要呈现的数据 03 封装横向柱状图 基于Echarts的二次封装 创建渐变色：color: new echarts.graphic.LinearGradient(0, 0, 0, 1,[ {offset: 0, color: #14c8d4}, {offset: 1, color: #43eec6} ] 知识点总结 前后端的配置项问题(前台样式与展示数据) JS?对象构造问题(工厂模式，继承，实例化) JS?匿名函数自调(避免污染全局变量) JS?文件加载问题(typeof=undefine) Echart渐变色echarts.graphic.LinearGradient 改变Echarts绘制出图像的大小 JSON?数据的格式问题(单双引号，数组与对象) Ajax?异步请求与请求成功之后的回调函数 ES6?的小了解(拼接字符串与变量) CSS?与?CSS3(没有几个人比我知道的多) 04 统计用户页面驻留时间 1.localstroage?的存取问题 2.?监听当前标签页是否关闭或最小化 页面可见性改变(visibilitychange)事件 3. onbeforeunload?事件的触发与执行 4.?结合?PHP?与?MySQL?完整实现用户驻留页面时间的统计(前台实现)与存取(后台实现?php?操作?mysql?数据库) 05 重构设置参数页面 Bootstrap： Form表单，modal模态框 Angular 1.0: 绑定ng-model，监听$watch,循环ng-repeat,展示ng-if与ng-show 06 绘制市场空间页面 Angular 2.0： 组件三要素：Ts,Html,css 自制dropDownList组件 @Input,@Output与EventEmitter 国际化I18nService 三：未来计划 去探索更多CSS的可能性 路漫漫其修远兮，吾将上下而求索 THANKS * * * * * *