轉自：https://idig8.com/2018/09/23/xiaochengxujavashizhanxiaochengxushipinliebiaodaoxiangqinggongneng57/

目前直接展示的都是詳情頁面，現在需要完成通過詳情可以直接跳轉到首頁，通過首頁點擊某個視頻，可以跳轉到某個視頻詳情中。源碼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開發中也比較普遍，千萬不要有老鐵通過緩存的方式傳值，可以是可以但是不清晰了。

「小程序JAVA實戰」小程序視頻列表到詳情功能（58）