Flutter中点击文本框时WebView自动重载问题求助（webview_flutter^4.4.4）

云原生阿岚

2026-7-2

解决WebView点击文本框自动重载的问题

问题根源

你在build方法里直接实例化WebViewController，每次Widget重建（比如点击输入框唤起系统键盘、页面布局调整等场景）都会重新创建控制器并触发页面加载，这就是WebView自动重载的核心原因。

解决方案

把WebViewController的初始化逻辑移到State的initState方法中，用成员变量保存实例，确保整个Widget生命周期内只创建一次控制器。

修改后的代码示例

class _YourWebViewState extends State<YourWebViewWidget> {
  late final WebViewController _webViewController;

  @override
  void initState() {
    super.initState();
    _webViewController = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..setBackgroundColor(const Color(0x00000000))
      ..setNavigationDelegate(
        NavigationDelegate(
          onNavigationRequest: (NavigationRequest request) {
            if (request.url.contains(returnURL)) {
              final uri = Uri.parse(request.url);
              final payerID = uri.queryParameters['PayerID'];
              if (payerID != null) {
                Get.find<PricePlaningController>()
                    .executePayment(executeUrl, payerID, accessToken)
                    .then((id) {
                  widget.onFinish(id);
                  Navigator.of(context).pop();
                });
              } else {
                Navigator.of(context).pop();
              }
              Navigator.of(context).pop();
            }
            if (request.url.contains(cancelURL)) {
              Navigator.of(context).pop();
            }
            return NavigationDecision.navigate;
          },
        ),
      )
      ..loadRequest(Uri.parse(checkoutUrl));
  }

  @override
  Widget build(BuildContext context) {
    return WebViewWidget(controller: _webViewController);
  }
}