2.播放量数据进行处理转换

根据开发接口文档里面的教程在本地去开启虚拟服务器从而可以获得对应的数据

二、项目初始化

新建一个空文件夹然后打开微信开发者工具新建一个云开发的微信小程序项目。

2.封装service请求

这里采用ES6的相关语法返回一个promise之后在对应组件中去引入zjerequest即可进行相应的请求

const

ZJERequest{request(url,method,params){return

new

Promise((resolve,reject){wx.request({url:BASE_URLurl,method:method,data:params,success:function(res){

resolve(res)},fail:function(err){

reject(err)}})})}get(url,params){return

this.request(url,GET,params)}post(url,params){return

const

1.首先先建立两个主要的文件夹home-music和home-video

2.播放量数据进行处理转换

在使用vue中我们知道直接使用fliter就可以实现过滤器的功能但是在原生微信小程序中没有这个概念官方给出了一种

WXS脚本语言

wxml中无法调用在页面的js中定义的函数就是说在wxml文件里面不能直接写filter来对某个数据进行操作需要去js文件里面对数据进行处理然后再响应到页面或者说在新文件wxs里面去写一个函数实现filter然后在wxml里面引入这个模块然后再使用模块里面的方法去进行处理但是wxml可以调用wxs中定义的函数

wxs的语法类似于JavaScript但是wxs和JavaScript时完全不同的两种语言wxs有自己的数据类型wxs不支持类似于ES6及以上的语法wxs遵守CommonJS规范第一种解决方法在js文件里面进行处理

但是这种方式比较繁琐需要在每一次修改完data里面的数据之后再重新使用setData去进行重新赋值

3.时长数据进行处理转换

formatDuration(duration){durationduration/1000var

minuteMath.floor(duration/60);var

secondMath.floor(duration)%60return

minute:second

将video遍历的每个item封装成一个公共的组件方便代码管理

1首先先创建一个公共组件文件夹components然后创建一个video-item-v1组件

3使用组件

在发送请求的时候将请求条数等写在组件的js文件中会显得比较繁琐所以可以采用将这个请求封装在其他的文件中在每一次想要重新请求的时候可以直接把需要的条数传进去就可以了

注意要使用await和async​

给组件添加一个点击事件同时将点击的对象内容昨晚一个属性绑定到当前对象身上这样就能直接通过点击获取到这个对象身上的全部数据同时进行页面的跳转

video-item-v1

data-item{{item}}/video-item-v1handleVideoItemClick:function(event){//

获取idconst

idevent.currentTarget.dataset.item.id//

./../detail-video/index?idid,})