如何在颤振中保留 WebView 状态?

Question

我有一个WebView页面，我想使用kf_drawer菜单选项加载它。当我从一个页面切换到另一个页面时，我的 WebView 的状态不会被记住，并且每次都会重新加载。

这是我的菜单页面代码：

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:kelp/bookWB.dart';
import 'package:kelp/profileWebView.dart';
import 'package:kf_drawer/kf_drawer.dart';
import 'classBuilder.dart';
import 'package:kelp/home.dart';
class DrawerMenu extends StatefulWidget {
DrawerMenu({Key key, this.title, this.visibleLogin}) : super(key: key);
final String title;
final bool visibleLogin;
@override
_DrawerMenuState createState() => _DrawerMenuState();
}
class _DrawerMenuState extends State<DrawerMenu>with TickerProviderStateMixin {
KFDrawerController _drawerController;
@override
void initState() {
super.initState();
_drawerController = KFDrawerController(
initialPage: ClassBuilder.fromString('HomeWebView'),
items: [
KFDrawerItem.initWithPage(
text: Text('HomeWebView', style: TextStyle(color: Colors.white)),
icon: Icon(Icons.home, color: Colors.white),
page: HomeWebView(),
),
KFDrawerItem.initWithPage(
text: Text(
'Profile',
style: TextStyle(color: Colors.white),
),
icon: Icon(Icons.calendar_today, color: Colors.white),
page:ProfileWebView(),
),
KFDrawerItem.initWithPage(
text: Text(
'Book',
style: TextStyle(color: Colors.white),
),
icon: Icon(Icons.settings, color: Colors.white),
page: BookWebView(),
),
],
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body:KFDrawer(
controller: _drawerController,
header: Align(
alignment: Alignment.centerLeft,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16.0),
width: MediaQuery.of(context).size.width * 0.6,
child: Image.asset(
'assets/logo.png',
alignment: Alignment.centerLeft,
),
),
),
footer: KFDrawerItem(
text: Text(
'SIGN IN',
style: TextStyle(color: Colors.white),
),
icon: Icon(
Icons.input,
color: Colors.white,
),
),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Color.fromRGBO(255, 25, 255, 1.0), Color.fromRGBO(44, 72, 171, 1.0)],
tileMode: TileMode.repeated,
),
),
),
);
}
} 

这里的类生成器是：

import 'package:kelp/bookWB.dart';
import 'package:kelp/home.dart';
import 'package:kelp/profileWebView.dart';
typedef T Constructor<T>();
final Map<String, Constructor<Object>> _constructors = <String, Constructor<Object>>{};
void register<T>(Constructor<T> constructor) {
_constructors[T.toString()] = constructor;
}
class ClassBuilder {
static void registerClasses() {
register<HomeWebView>(() =>HomeWebView());
register<ProfileWebView>(() =>ProfileWebView());
register<BookWebView>(() => BookWebView());
}
static dynamic fromString(String type) {
return _constructors[type]();
}
}

这是我的网页视图页面：

import 'package:flutter/material.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:kf_drawer/kf_drawer.dart';
class BookWebView extends KFDrawerContent {
@override
_BookWebViewState createState() => _BookWebViewState();
}
class _BookWebViewState extends State<BookWebView>
with AutomaticKeepAliveClientMixin<BookWebView> {
final Set<JavascriptChannel> jsChannels = [
JavascriptChannel(
name: 'Print', onMessageReceived: (JavascriptMessage message) {}),
].toSet();
@override
Widget build(BuildContext context) {
super.build(context);
return Container(
height: MediaQuery.of(context).size.height * 0.8,
width: MediaQuery.of(context).size.width,
child: Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(
Icons.menu,
color: Colors.black,
),
onPressed: widget.onMenuPressed,
),
),
backgroundColor: Colors.white,
body: WebView(
javascriptMode: JavascriptMode.unrestricted,
initialUrl: 'https://google.com',
),
),
);
}
@override
bool get wantKeepAlive => true;
}

每次打开初始页面时，它都会不断重新加载。 我正在使用webview_flutter打开我的 Web 视图。

Answer 1

webview_flutter可以保留其当前会话，但此处发生的情况是，具有 WebView 的页面可能已被弹出。导航回页面将加载 Web View 的新实例，并再次加载initialUrl。

由于webview_flutter的这种限制，我只看到它在第三方 WebView 插件(如flutter_inappwebview(上实现。