实现抖音上下滑动切换视频,手机过热,求官方解答
发布于 5 年前 作者 guiyingchen 5520 次浏览 来自 问答
  • 当前 Bug 的表现(可附上截图)

已经实现了 上下滑动,采用官方提供的 api bindtouchstart  和 bindtouchend,

但是手机过热,单独使用 两个api  都没有 问题,同时使用,过热明显,而且费电,求官方解答

  • 预期表现

手机正常

  • 复现路径
  • 提供一个最简复现 Demo
3 回复

bindtouchstart  和 bindtouchend

都是高频js,使用是非常消耗性能的,加上你这么不断频繁的使用,当然会出现温度升高,发热的问题,建议使用函数防抖或函数节流

提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

微信版本:7.0.1  手机机型:iphone 8  IOS 版本号:12.1

简单说下 ,这个机型过热明显,

一些安卓 还有iphoneX 温度也有小幅度升高(测试机型有限),温度还可以接受

下面是 我们简化后的页面,可以复现问题

wxml:

<video src=http://1255883977.vod2.myqcloud.com/d1975e76vodgzp1255883977/84951cf65285890784164350877/lpyI9TqyGLUA.mp4 autoplay=‘true’ controls=’{{false}}’ bindplay=‘statisticPlay’ style=‘height: calc(100% - 3rem);width: 100%;left: 0;position:fixed;’ loop=‘true’

id=‘videPlay’/>

<cover-view  bindtouchend=‘touchEnd’  catchtap=‘stopPlay’ bindtouchstart=“touchStart” style=‘position: fixed;top:0;left:0;background:rgba(0,0,0,0.1);height: calc(100% - 3rem);width: 100%;z-index:1;’ />

js:

var app = getApp();

Page({

/**

  * 页面的初始数据

  */

data: {

playNum:0,

touchInfo: {},

},

/**

  * 生命周期函数–监听页面加载

  */

onLoad: function (options) {

var that =this;

},

/**

  * 生命周期函数–监听页面初次渲染完成

  */

onReady: function () {

},

/**

  * 生命周期函数–监听页面显示

  */

onShow: function () {

},

/**

  * 生命周期函数–监听页面隐藏

  */

onHide: function () {

},

/**

  * 生命周期函数–监听页面卸载

  */

onUnload: function () {

},

/**

  * 页面相关事件处理函数–监听用户下拉动作

  */

onPullDownRefresh: function () {

},

/**

  * 页面上拉触底事件的处理函数

  */

onReachBottom: function () {

},

/**

  * 用户点击右上角分享

  */

onShareAppMessage: function () {

},

plaing:function(e){

},

statisticPlay:function(e){

console.log(e);

},

touchStart: function (e) {

var touchInfo = this.data.touchInfo;

touchInfo.start = e.touches[0];

this.setData({

touchInfo: touchInfo

})

},

touchEnd: function (e) {

var touchInfo = this.data.touchInfo;

touchInfo.end = e.changedTouches[0];

this.setData({

touchInfo: touchInfo

})

this.computer();

},

computer: function () {

var that = this;

var touchInfo = that.data.touchInfo;

var playNum = that.data.playNum;

if (touchInfo.start.pageY - touchInfo.end.pageY > 30) {

++playNum;

}

if (touchInfo.start.pageY - touchInfo.end.pageY < -30) {

–playNum;

}

if (playNum < 0) {

return;

}

if (that.data.playNum != playNum) {

that.setData({

playNum: playNum

})

that.changeVideo();

}

},

changeVideo: function (callback) {

this.videoContext = wx.createVideoContext(‘videPlay’);

},

})

回到顶部