公司党建在线视频学习

项目描述：

APP端完成视频列表，视频筛选（tab切换类型带上拉加载的视频列表），视频播放并保存在本地和后端。

技术栈：

vue全家桶+mint-ui+swiper

主要实现步骤：

1、视频列表采用mint-ui loadmore模块实现上拉加载和下拉刷新

2、视频筛选列表导航部分封装为组件，当大于四个分类时计算容器宽度，实现左右滑动，同时通过组件间传递参数，实现点击分类，内容部分左右滑动切换。内容部分每个分类均可上拉分页，封装成独立组件，动态根据分类生成相应的模块，可实现参数在组件内的独立作用域。当左右滑动内容部分时（采用swiper）,传递参数给导航组件切换相应的类型

3、视频播放调用公司api实现播放功能和获得播放后的播放时间参数及播放状态参数。本地缓存采用localStorage定义一个字段（json数组）来存储，当该视频从没有被播放时会想播放记录中增加一条，当条数超过一定数额，将第一条移除，追加新的到最后一条。当播放过时，遍历缓存字段，当播放时间大于缓存播放时间则替换。

主要遇到问题：

1、在vue中通过JS操作dom要在vm.$nextick()函数中操作，该函数表示dom更新完成。

2、vue组件内参数发生变化时且该参数变化会有下一步动作，多多使用watch。

3、当回循环渲染复杂dom结构时，将循环部分封装成独立的组件，若直接写在一个页面会造成业务冗杂，代码逻辑困难。

4、数字字符串比大小事要转成number类型（做视频缓存时遇到的坑...）

5、加载转圈在所有接口回来之后才消失可以用promise.all来实现

公司党建在线视频学习相关推荐

碎片化时间学习，这几个在线视频学习网站值得拥有！
随着生活节奏加快,利用碎片化时间学习来充实自己显得尤其重要,这几个在线视频学习网站能够让你在闲暇的时间将IT编程技术更进一步,学习技巧更加高效. 1.慕课网慕课网(IMOOC)是国内最大的IT技能学 ...
基于协同过滤算法的在线视频学习答题自动化批改平台习题问答系统
1 简介今天向大家介绍一个计算机专业毕业设计项目,基于协同过滤算法的在线视频学习答题自动化批改平台习题问答系统. 使用协同过滤算法完成习题推荐,在线视频学习,试卷自动化组卷,批改评分在网络技术的 ...
adobe illustrator AI免费在线视频学习
adobe illustrator AI免费视频学习 http://www.52zxw.com/kecheng_8.html http://coreldraw.57zxw.net/AICS5/
微信小程序视频点播在线视频学习系统毕业设计课程设计（5）视频播放页面
wxml代码 <view class="biaoti">视频课程:微信小程序样式Flex Box ...
基于SSM的微信小程序在线视频学习平台
目录一.整体目录(示范): 文档含项目技术介绍.E-R图.数据字典.项目功能介绍与截图等二.运行截图三.代码部分(示范): 四.数据库表(示范): 数据库表有注释,可以导出数据字典及更新数据 ...
初中生学计算机视频,推荐一下适合中学生的在线视频学习网站
英语语法省略句精讲一.并列复合句中某些相同成分的省略. 1. This beeper works well,but that one doesnt (work well). 这个寻呼机工作正常,但那 ...
在线视频学习网站的设计与实现
运行环境: jdk 1.8 IDE环境: Eclipse,Myeclipse,IDEA都可以 tomcat环境: Tomcat 7.x,8.x,9.x版本均可,理论上Tomcat版本不是太老都可以. ...
用Python生成答题库，辅助完成XX在线平台视频学习的课后考试
文章目录前言思路引入库和全局变量一.截图二.选图三.识图四.生成答题库完整代码最终效果作者语前言随着XX在线视频学习的任务增多,有时刷完视频并不能轻松完成课后考试,本篇文章意在 ...
程序员视频学习网站，推荐这几个网站不错
想要学好编程,就要多努力挖掘有用的知识,在编程行业,有几个程序员可以学习的视频网站,不管是自学还是培训学习,这些网站都可以帮助到自己,下面小编就为大家做一一的介绍. 程序员视频学习网站,推荐这几个网站 ...

公司党建在线视频学习

公司党建在线视频学习相关推荐

最新文章

热门文章