ReactNative H5 页面显示 react-native-webview 高度自适应

最新推荐文章于 2024-08-22 09:36:46 发布

dabusidede

最新推荐文章于 2024-08-22 09:36:46 发布

阅读量524

点赞数 1

分类专栏： ReactNative

本文链接：https://blog.csdn.net/dabusidede/article/details/108938055

版权

本文介绍了如何在ReactNative应用中使用WebView并实现高度自适应。通过引入react-native-webview包，结合简单示例和高度自适应策略，确保H5页面在ReactNative环境中能正确显示并自动调整高度。

摘要由CSDN通过智能技术生成

安装包

react-native-webview

简单示例

import React from 'react'
import WebView from 'react-native-webview'

class Component extends React.Component {
   
    createHtml() {
   
        return `
        <div id="canvas" style=""></div>
        <script>
            window.onload = function () {
            }
        </script>
        `
}

    render() {
   
        return (
            <WebView
                source={
   {
    html: this.createHtml() }}
            />
        );