内容简介:目前直接展示的都是详情页面,现在需要完成通过详情可以直接跳转到首页,通过首页点击某个视频,可以跳转到某个视频详情中。源码https://github.com/limingios/wxProgram.git 中No.15通过block 索引的方式找到点击的对应视频列表中的其中一个传递给详情页面
目前直接展示的都是详情页面,现在需要完成通过详情可以直接跳转到首页,通过首页点击某个视频,可以跳转到某个视频详情中。源码https://github.com/limingios/wxProgram.git 中No.15
修改首页功能
通过block 索引的方式找到点击的对应视频列表中的其中一个传递给详情页面
const app = getApp() Page({ data: { // 用于分页的属性 totalPage: 1, page: 1, videoList: [], screenWidth: 350, serverUrl: "", searchValue:"" }, onLoad: function (params) { var me = this; var screenWidth = wx.getSystemInfoSync().screenWidth; me.setData({ screenWidth: screenWidth, }); var searchValue = params.searchValue; var isSaveRecord = params.isSaveRecord; if (isSaveRecord == null || isSaveRecord == "" || isSaveRecord == undefined){ isSaveRecord = 0; } me.setData({ searchValue: searchValue, }); // 获取当前的分页数 var page = me.data.page; me.getAllVideosList(page, isSaveRecord); }, getAllVideosList: function (page, isSaveRecord){ var me = this; var serverUrl = app.serverUrl; wx.showLoading({ title: '请等待,加载中...', }); wx.request({ url: serverUrl + '/video/showAll?page=' + page + "&isSaveRecord =" + isSaveRecord, method: "POST", data:{ videoDesc: me.data.searchValue }, success: function (res) { wx.hideLoading(); wx.hideNavigationBarLoading(); wx.stopPullDownRefresh(); console.log(res.data); // 判断当前页page是否是第一页,如果是第一页,那么设置videoList为空 if (page === 1) { me.setData({ videoList: [] }); } var videoList = res.data.data.rows; var newVideoList = me.data.videoList; me.setData({ videoList: newVideoList.concat(videoList), page: page, totalPage: res.data.data.total, serverUrl: serverUrl }); } }) }, onPullDownRefresh: function (params) { var me = this; wx.showNavigationBarLoading(); me.getAllVideosList(1,0); }, onReachBottom: function (params){ var me = this; var currentPage = me.data.page; var totalPage = me.data.totalPage; //判断当前页数和总页数是否相等,如果相同已经无需请求 if (currentPage == totalPage){ wx.showToast({ title: '已经没有视频啦~', icon:"none" }) return; } var page = currentPage+1; me.getAllVideosList(page,0); }, showVideoInfo:function(e){ var me = this; var videoList = me.data.videoList; var arrIndex = e.target.dataset.arrindex; var videoInfo = JSON.stringify(videoList[arrIndex]); wx.redirectTo({ url: '../videoInfo/videoInfo?videoInfo=' + videoInfo, }) } })
详情页面获取传递过来的内容复制src
var videoUtils = require('../../utils/videoUtils.js') const app = getApp() Page({ data: { cover:'cover', videoContext:"", videoInfo:{}, videId:'', src:'' }, showSearch:function(){ wx.navigateTo({ url: '../videoSearch/videoSearch', }) }, onLoad:function(params){ var me = this; me.videoContext = wx.createVideoContext('myVideo', me); var videoInfo = JSON.parse(params.videoInfo); me.setData({ videId: videoInfo.id, src: app.serverUrl + videoInfo.videoPath, videoInfo: videoInfo }) }, showIndex:function(){ wx.redirectTo({ url: '../index/index', }) }, onShow:function(){ var me = this; me.videoContext.play(); }, onHide:function(){ var me = this; me.videoContext.pause(); }, upload:function(){ videoUtils.uploadVideo(); } })
PS: 页面的跳转传值在html和jsp开发中也比较普遍,千万不要有老铁通过缓存的方式传值,可以是可以但是不清晰了。
>>原创文章,欢迎转载。转载请注明:转载自IT人故事会,谢谢!
>>原文链接地址:
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- 「小程序JAVA实战」小程序搜索功能(54)
- 「小程序JAVA实战」小程序视频封面处理(47)
- 「小程序JAVA实战」小程序开源搜索组件(52)
- 「小程序JAVA实战」小程序的关注功能(64)
- 「小程序JAVA实战」小程序注册界面的开发(29)
- 「小程序JAVA实战」小程序数据缓存API(53)
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。