鸿蒙开发者社区

公众号矩阵

移动端

视频课免费课排行榜短视频直播课软考学堂

全部课程软考信创认证华为认证厂商认证 IT技术 PMP项目管理免费题库

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO软考

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

51CTO软考题库

鸿蒙开发者社区

登录/注册
51CTO

中国优质的IT技术网站

51CTO博客

专业IT技术创作平台

51CTO学堂

IT职业在线教育平台

活动短视频专栏极客Show 鸿蒙技术特刊

HarmonyOS 如何实现webView作为Listitem时准确获取webView高度

如题，项目中需要实现加载html文本数据，webView作为Listitem需要按照webView实际高度动态设置Listitem高度，请问怎样获取高度，且webView加载完成的回调函数是哪个，有没有相关的文档？

HarmonyOS

2024-12-25 14:03:34

浏览

赞

收藏 0

回答 1

待解决

回答 1

按赞同

/

按时间

1、加载完成、查看【Web组件的生命周期】onPageEnd https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/web-event-sequence-V5

2、获取webView高度，可以参考下面的方法，或者通过 getPageHeight获取高度 https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-webview-V5#getpageheight

// index.html
<!DOCTYPE html>
  <html>
  <body>
  <p>
  <h1>1111111111</h1>
  <h2>1111111111</h2>
  <h2>1111111111</h2>
  </p>
  </body>
  <script type="text/javascript">
  function watchWindowSize(){
    var h = document.body.clientHeight;
    return h; }
  </script>
  </html>
  // xxx.ets
  import web_webview from '@ohos.web.webview';


@Entry
@Component
struct WebHeightPage {
  controller: web_webview.WebviewController = new web_webview.WebviewController();
  @State webResult: number = 10
  @State pageHeight: number = 10;
  build() {
    Column() {
      Text(this.webResult.toString()).fontSize(20)
      Web({ src: $rawfile('index.html'), controller: this.controller })
        .javaScriptAccess(true)
        .onPageEnd(e => {
          this.controller.runJavaScript(
            'watchWindowSize()',
            (error, result) => {
              this.webResult = Number(result)
              // 通过getPageHeigh获取
              let pageHeight = this.controller.getPageHeight();
              pageHeight = this.webResult;
              console.info('webResult=' + this.webResult);
              console.info('pageHeight=' + pageHeight);
            }
          );
        })
        .width('100%')
        .height(this.webResult )
    }
  }
}

回复

2024-12-25 17:33:39

如何写精华回答，获更多曝光？

发布

相关问题

HarmonyOS webView如何获取整体内容高度

784浏览 • 1回复待解决

HarmonyOS webview中调起键盘后，webview的高度会被压缩

800浏览 • 1回复待解决

HarmonyOS WebView处理SSLError事件时如何获取异常URL

878浏览 • 1回复待解决

HarmonyOS webview elm.scrollTop返回值不准确

931浏览 • 1回复待解决

HarmonyOS webview高度不能自适应

1006浏览 • 1回复待解决

HarmonyOS 如何实现listItem高度随内容自适应

1399浏览 • 1回复待解决

HarmonyOS 如何获取Webview的宽高

870浏览 • 1回复待解决

WebView 如何实现长截图

2473浏览 • 1回复待解决

webview如何实现charles抓包

2307浏览 • 1回复待解决

HarmonyOS listItem怎么获取每条的高度，这样获取的高度不是按照顺序来的？

989浏览 • 1回复待解决

HarmonyOS webview加载html之后，通过this.webviewController.getPageHeight()获取的高度不正确

1652浏览 • 1回复待解决

HarmonyOS 获取webview中的cookie

1242浏览 • 1回复待解决

WebView之通信，什么是WebView，为什么要通信，如何实现通信？

3457浏览 • 1回复待解决

HarmonyOS webview使用javaScriptProxy时如何注册多个name

853浏览 • 1回复待解决

HarmonyOS Navigation如何在加载webview成功时获取到web的标题等信息

1656浏览 • 1回复待解决

HarmonyOS Webview如何实现下拉刷新效果

955浏览 • 1回复待解决

webview如何实现网络请求拦截功能

3372浏览 • 1回复待解决

HarmonyOS webview键盘关闭之后，web窗口高度没有自动恢复

957浏览 • 1回复待解决

HarmonyOS 使用@ohos.web.webview封装通用webview组件时基础回调问题

1577浏览 • 1回复待解决

HarmonyOS webview嵌套在布局中间，高度和滚动问题

1842浏览 • 2回复待解决

HarmonyOS WebView实现同层渲染资料

1066浏览 • 1回复待解决

HarmonyOS webview如何调试？

2447浏览 • 1回复待解决

HarmonyOS webview如何生成pdf

841浏览 • 1回复待解决

HarmonyOS webview如何设置sessionStorage

768浏览 • 1回复待解决

webview放在Tabs上，webview上滑动时会响应Tabs的滑动事件，如何处理滑动在webview上时不响应Tabs的滑动

1322浏览 • 1回复待解决

提问

该提问已有0人参与，帮助了0人

相关讨论帖

harmonyos webview范例 0回复

鸿蒙WebView如何加载http链接 0回复

HarmonyOs webview 加载本地html 6回复

WebView与js交互总结 0回复

鸿蒙Flutter实战：04-如何使用DevTools调试Webview 0回复

Copyright © 2005-2025 51CTO.COM 京ICP证060544版权所有未经许可请勿转载