Flutter 4.x 版本 webview_flutter 嵌套H5

Jim-zf

于 2025-05-30 11:44:31 发布

阅读量536

点赞数 4

CC 4.0 BY-SA版权

文章标签： flutter

本文链接：https://blog.csdn.net/weixin_46600931/article/details/148335192

踩坑早期版本使用 WebView 代码如下

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class HomePage extends StatelessWidget {
  const HomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('首页')),
      body: SafeArea(
        child: WebView(

            initialUrl: url,
    
            javascriptMode: JavascriptMode.unrestricted,

      ),
      ),
    );
  }
}

但是在flutter 会报错。很多博主都是这个写法，导致踩坑拍错很久

正确写法应该是：

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class HomePage extends StatelessWidget {
  const HomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('首页')),
      body: SafeArea(
        child: WebViewWidget(
          controller:
              WebViewController()
                ..setJavaScriptMode(JavaScriptMode.unrestricted)
                ..loadRequest(Uri.parse('https://www.baidu.com')),
        ),
      ),
    );
  }
}