Flutter Web 应用程序的 Web 视图

Posted 2023-02-23

【中文标题】Flutter Web 应用程序的 Web 视图

【英文标题】：web view for flutter web application

【发布时间】：2021-05-25 11:11:14

【问题描述】：

我是 Flutter 的新手，我开始通过 Flutter 创建一个 Web 应用程序。我需要一个网页视图来打开一个网页。 webView 适用于 ios 和 android 但不支持 web 应用程序。

import 'dart:io';
import 'package:jsonmapper/articlemap.dart';
import 'package:main.dart';
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:webview_flutter/webview_flutter.dart';

class ArticlePage extends StatefulWidget 
  final String title;
  final String nid;

  ArticlePage(this.title, this.nid, Key key) : super(key: key);

  @override
  _ArticlePageState createState() => _ArticlePageState();


class _ArticlePageState extends State<ArticlePage> 
  ArticleMap _articleMap;
  bool _firstnavigate = true;

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text(
          widget.title,
          style: styles.textStyle(color: Colors.white),
          overflow: TextOverflow.ellipsis,
        ),
      ),
      body: Platform.isAndroid || Platform.isIOS
          ? WebView(
              initialUrl: url,
              javascriptMode: JavascriptMode.unrestricted,
              navigationDelegate: (NavigationRequest request) 
                if (_firstnavigate) 
                  _firstnavigate = false;
                  return NavigationDecision.navigate;
                 else 
                  launch(request.url);
                  return NavigationDecision.prevent;
                
              ,
            )
          : launchURL(url),
    );
  

  launchURL(String url) async 
    if (await canLaunch(url)) 
      await launch(url);
     else 
      throw 'Could not launch $url';
    
  

当我在 Web 应用程序中午餐 URL 时出现此错误。

Expected a value of type 'widget?', but got one of type '_Future<dynamic>'

你对这个问题有什么想法或更好的解决方案吗？！

【问题讨论】：

this 技巧对我有用：我希望有用

【参考方案1】：

您应该将Widget 传递给Scaffold.body 属性，但launchURL(url) 正在返回另一种类型（Future<dynamic>）。 为了摆脱错误，您可以例如让用户单击一个按钮来启动您的网址：

Platform.isAndroid || Platform.isIOS
    ? WebView(
  initialUrl: url,
  javascriptMode: JavascriptMode.unrestricted,
  navigationDelegate: (NavigationRequest request) 
    if (_firstnavigate) 
      _firstnavigate = false;
      return NavigationDecision.navigate;
     else 
      launch(request.url);
      return NavigationDecision.prevent;
    
  ,
) : ElevatedButton(
  onPressed: () => launchURL(url),
  child: Text('Go to Website'),
)