- 当前 Bug 的表现(可附上截图)
- 预期表现
我这边使用的是touchmove实时渲染悬浮窗位置,但是按住往下滑动的时候会导致页面刷新,而 我这个页面又是需要的下拉刷新的,现在情况就是按住滑动的时候背景也会滑动,请问怎么解决
- 复现路径
- 提供一个最简复现 Demo
< view class = "cs_button" catchtouchmove = 'btn_move' catchtouchend = 'btn_end' style = 'top:{{clientY}};left:{{clientX}}' > < view style = 'width:100rpx; height:100rpx;background-color:red' ></ view > </ view > |
.cs_button {
border : 0px ;
height : 100 rpx;
position : fixed ;
background-color : transparent ;
z-index : 9999 ; } |
Page({ data: { windowWidth: 0, clientY: '80%' , clientX: '85%' }, onLoad: function () { var _this = this wx.getSystemInfo({ success(res) { _this.setData({ windowWidth: res.windowWidth }) } }) }, btn_move: function (e) { var yaxes = parseInt((e.changedTouches[0].clientY - 20)), xaxes = parseInt((e.changedTouches[0].clientX - 20)) this .setData({ clientY: yaxes + 'px' , clientX: xaxes + 'px' }) }, btn_end: function (e) { var width = parseInt(( this .data.windowWidth) / 2), yaxes = parseInt((e.changedTouches[0].clientY - 20)), xaxes = parseInt((e.changedTouches[0].clientX - 20)) if (xaxes + 20 > width) { var xaxes = '85%' } else { var xaxes = '5%' } this .setData({ clientY: yaxes + 'px' , clientX: xaxes }) }, }) |
应该在你的悬浮窗顶层去加catch:touchmove
之前加了,没用
bind => catch
用的确实是catch
<view class="cs_button" catchtouchmove='btn_move' catchtouchend='btn_end' style='top:{{clientY}};left:{{clientX}}'>
<image class="cs_image" src="{{base64Imgs.suspension}}"></image>
</view>
这。。就很尴尬了啊~ 能做个代码片段吗?
<view class="cs_button" catchtouchmove='btn_move' catchtouchend='btn_end' style='top:{{clientY}};left:{{clientX}}'>
<view style='width:100rpx; height:100rpx;background-color:red'></view>
</view>
.cs_button {
border: 0px;
height: 100rpx;
position: fixed;
background-color: transparent;
z-index: 9999;
}
Page({
data: {
windowWidth: 0,
clientY: '80%',
clientX: '85%'
},
onLoad: function () {
var _this = this
wx.getSystemInfo({
success(res) {
_this.setData({
windowWidth: res.windowWidth
})
}
})
},
btn_move: function (e) {
var yaxes = parseInt((e.changedTouches[0].clientY - 20)),
xaxes = parseInt((e.changedTouches[0].clientX - 20))
this.setData({
clientY: yaxes + 'px',
clientX: xaxes + 'px'
})
},
btn_end: function (e) {
var width = parseInt((this.data.windowWidth) / 2),
yaxes = parseInt((e.changedTouches[0].clientY - 20)),
xaxes = parseInt((e.changedTouches[0].clientX - 20))
if (xaxes + 20 > width) {
var xaxes = '85%'
} else {
var xaxes = '5%'
}
this.setData({
clientY: yaxes + 'px',
clientX: xaxes
})
},
})
发不出文件,代码复制过来,json文件里还有句 "enablePullDownRefresh": true
好的