uniapp 开发app 开启页面的下拉刷新无效

pages.json最初配置(最终game over)
{"path": "pages/login/index","style": {"navigationBarTitleText": "登录","enablePullDownRefresh": true}}
//全局部分
"globalStyle": {"navigationBarTextStyle": "black","navigationBarTitleText": "跑步吧","navigationBarBackgroundColor": "#F8F8F8","backgroundColor": "#F8F8F8","app-plus": {// 将回弹属性关掉"bounce": "none"}},

解决方式(这是我自己的解决办法不知道是否适用于大家)

  • page.json (单独设置app端开启下拉刷新)
  • 参考文档,找到下拉刷新的说明部分
  • 下拉刷新使用注意
    • enablePullDownRefresh 与 pullToRefresh->support 同时设置时,后者优先级较高。
    • 如果期望在 App 和小程序上均开启下拉刷新的话,请配置页面的 enablePullDownRefresh 属性为 true。
    • 若仅期望在 App 上开启下拉刷新,则不要配置页面的 enablePullDownRefresh 属性,而是配置 pullToRefresh->support 为 true。
    • 开启原生下拉刷新时,页面里不应该使用全屏高的scroll-view,向下拖动内容时,会优先触发下拉刷新而不是scroll-view滚动
    • 原生下拉刷新的起始位置在原生导航栏的下方,如果取消原生导航栏,使用自定义导航栏,原生下拉刷新的位置会在屏幕顶部。如果希望在自定义导航栏下方拉动,只能使用circle方式的下拉刷新,并设置offset参数,将circle圈的起始位置调整到自定义导航下方。hello uni-app的扩展组件中有示例。
    • 如果想在app端实现更多复杂的下拉刷新,比如美团、京东App那种拉下一个特殊图形,可以使用nvue的组件。HBuilderX 2.0.3+起,新建项目选择新闻模板可以体验
    • 如果想在vue页面通过web前端技术实现下拉刷新,插件市场有例子,但前端下拉刷新的性能不如原生,复杂长列表会很卡
    • iOS上,default模式的下拉刷新和bounce回弹是绑定的,如果设置了bounce:none,会导致无法使用default下拉刷新

成功开启之后,重新配置"enablePullDownRefresh": true,结果也是成功开启了下拉刷新

{"path": "pages/index/index", //首页"style": {"app-plus": {"pullToRefresh": {"support": true,"color": "#ff3333","style": "default","contentdown": {"caption": "下拉可刷新自定义文本"},"contentover": {"caption": "释放可刷新自定义文本"},"contentrefresh": {"caption": "正在刷新自定义文本"}}}}}


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部