Flutter WebView导致其他组件无法交互的问题排查

当在Flutter中使用WebView时，会出现一个问题：WebView会拦截所有手势和鼠标事件，导致位于它上方的组件无法响应用户交互。比如在以下示例中，将WebView放入Stack组件后，叠在WebView上方的ListView完全无法滚动。

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

void main(List<String> args) {
  return runApp(const App());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Stack(
          children: [
            webview(),
            ListView.builder(
              itemCount: 10,
              itemBuilder: (context, index) {
                return SizedBox(
                  height: 100,
                  child: Text('Item $index'),
                );
              },
            ),
          ],
        ),
      ),
    );
  }

  Widget webview() {
    final controller = WebViewController()..loadHtmlString('''
<!DOCTYPE html>
<html>
<body>
    <h1>Hello World</h1>
</body>
</html>
''');

    return WebViewWidget(
      controller: controller,
    );
  }
}

内容的提问来源于stack exchange，提问作者Burhan Khanzada