小程序
小游戏
企业微信
微信支付
扫描小程序码分享
有一个需求：小程序的页面滚动距离超过指定位置时，将一个搜索框浮现出来，小于指定位置时，则影藏起来，我现在的做法是，页面onPageScroll回调函数中，实时检测是否滚动到对应的位置，然后用setData改变搜索框的样式，控制搜索所显示还是隐藏。
但是在实际测试过程中发现，当页面滚动到指定位置时，要等上好几秒，搜索框才会显示出来，从setData执行完到界面UI刷，有好几秒的延迟，请问这要如何处理？请各位大牛帮忙提供解决方法
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
理论上setData不应该会有好几秒这么长的延迟的，烦请提供一下机型，基础库版本和能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html），我们这边定位一下问题。
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
您好，我目前是在开发工具中测试的，开发工具的版本是v1.0.2.1803210，还没在真机上测试
那麻烦请提供一下代码片段。
/**
* 监听页面滚动时间处理函数
*/
onPageScroll(event) {
this .setSearchLocation(event);
},
getSearchLocation(){
//获取搜索框的dom信息
wx.createSelectorQuery().in( this ).select( '.search' ).boundingClientRect(rect => {
this .setData({ searchHeight: rect.height,searchTop: '-' + rect.height + 'px' });
}).exec();
getProductDom(){
//获产品列表的dom信息，产品列表的位置信息
let productDom = this .data.productDom;
if (!productDom) {
productDom = wx.createSelectorQuery().in( this ).select( '.productGrid' );
if (productDom){
this .setData({ productDom: productDom });
}
productDom.boundingClientRect(rect => {
this .setData({ productTop: rect.top });
setSearchLocation(scroll) {
//判断当前页面是否滚动到产品列表的位置，是则显示搜索框
if ( this .data.productTop){
if (scroll.scrollTop >= this .data.productTop) {
this .setData({ searchTop: '0px' });
} else {
this .setData({ searchTop: '-' + this .data.searchHeight + 'px' });
let productDom = this .getProductDom(); //
请参考后续链接中文档提供一下能够复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html ）。
我也有这个问题。
这个问题，我有个建议，setdata外层在加一层判断，searchTop当前值和要设置的值一样就不要进行setdata了。
楼主解决了吗？安卓机一直有延迟问题？
的确有这个问题，onPageScroll中加入节流控制，setData后，会延长好几秒才会更新
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
理论上setData不应该会有好几秒这么长的延迟的，烦请提供一下机型，基础库版本和能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html），我们这边定位一下问题。
您好，我目前是在开发工具中测试的，开发工具的版本是v1.0.2.1803210，还没在真机上测试
那麻烦请提供一下代码片段。
/**
* 监听页面滚动时间处理函数
*/
onPageScroll(event) {
this .setSearchLocation(event);
},
getSearchLocation(){
//获取搜索框的dom信息
wx.createSelectorQuery().in( this ).select( '.search' ).boundingClientRect(rect => {
this .setData({ searchHeight: rect.height,searchTop: '-' + rect.height + 'px' });
}).exec();
},
getProductDom(){
//获产品列表的dom信息，产品列表的位置信息
let productDom = this .data.productDom;
if (!productDom) {
productDom = wx.createSelectorQuery().in( this ).select( '.productGrid' );
if (productDom){
this .setData({ productDom: productDom });
}
}
if (productDom){
productDom.boundingClientRect(rect => {
this .setData({ productTop: rect.top });
}).exec();
}
},
setSearchLocation(scroll) {
//判断当前页面是否滚动到产品列表的位置，是则显示搜索框
if ( this .data.productTop){
if (scroll.scrollTop >= this .data.productTop) {
this .setData({ searchTop: '0px' });
} else {
this .setData({ searchTop: '-' + this .data.searchHeight + 'px' });
}
} else {
this .setData({ searchTop: '0px' });
let productDom = this .getProductDom(); //
}
}
请参考后续链接中文档提供一下能够复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html ）。
我也有这个问题。
这个问题，我有个建议，setdata外层在加一层判断，searchTop当前值和要设置的值一样就不要进行setdata了。
楼主解决了吗？安卓机一直有延迟问题？
的确有这个问题，onPageScroll中加入节流控制，setData后，会延长好几秒才会更新