HarmonyOS 如何监听Web加载的h5页面滚动到了最底部?

​在项目开发中,需要使用Web加载h5协议页面,需要监听用户滑动页面到了最底部。

Web组件好像没有监听滑动到最底部的监听事件,我使用Scroll嵌套Web,Scroll的onReachEnd方法也不会触发。

想问下有什么办法可以监听用户滑动到了最底部。​

HarmonyOS
2024-11-05 11:57:05
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect
// 示例代码参考 ets 
 
import webView from '@ohos.web.webview'; 
 
@Entry 
@Component 
struct WebViewPage { 
 
  controller: webView.WebviewController = new webView.WebviewController(); 
 
  build() { 
    Column() { 
      Web({ 
        src: $rawfile('offset.html'), 
        controller: this.controller 
      }) 
        .javaScriptAccess(true) 
        .domStorageAccess(true) 
        .verticalScrollBarAccess(true) 
        .onOverScroll((event) => { 
          if (event.yOffset < 0) { 
            console.log('已滑到顶端') 
          } 
          if (event.yOffset > 0) { 
            console.log('已滑到底端') 
          } 
        }) 
    } 
  } 
  // html 示例 ============================== 
 
  <!DOCTYPE html> 
  <html> 
  <head><title>每一天</title> 
  <style> 
  table { width: 100%; border-collapse: collapse; } th, td { border: 1px solid black; padding: 5px; text-align: center; } 
</style> 
  </head> 
  <body><h1>每一天</h1> 
  <table> 
  <tr> 
  <th>日期</th> 
  </tr> 
  <script> 
  var start = new Date(2024, 0, 1); var end = new Date(2025, 0, 1); for(var d = start; d < end; d.setDate(d.getDate() + 1)) { document.write("<tr><td>" + d.toISOString().slice(0,10) + "</td></tr>"); } 
</script> 
  </table> 
  </body> 
  </html>
分享
微博
QQ
微信
回复
2024-11-05 15:10:13
相关问题
HarmonyOS H5页面加载缓存机制
177浏览 • 1回复 待解决
HarmonyOS Web组件加载在线H5页面
139浏览 • 1回复 待解决
如何使H5页面适配多设备?
593浏览 • 1回复 待解决
HarmonyOS h5页面缩放问题
414浏览 • 0回复 待解决
HarmonyOS h5页面是否可以适配Harmony OS
390浏览 • 1回复 待解决
如何HarmonyOS中调试h5页面
796浏览 • 1回复 待解决
HarmonyOS web组件加载h5h5拉起摄像头
471浏览 • 1回复 待解决
HarmonyOS h5返回上一页面时会闪一下
316浏览 • 1回复 待解决
Web组件和h5页面如何交互?
133浏览 • 1回复 待解决
HarmonyOS web通过loadData加载h5标签
117浏览 • 1回复 待解决