Flutter 如何使webview在我的Flatter应用程序中切换appbar时不重新加载？

我不想在我的Flitter应用程序中切换appbar时重新加载webview，但我不知道该怎么做，很抱歉我是个初学者

这是我录制的gif：

我在谷歌上搜索过，但没有找到与此相关的答案

//index.dart
进口“包装：颤振/材料.省道”；
导入“导航选项卡.省道”；
导入“../home/home_page.dart”；
导入“../market/market_page.dart”；
导入“../my/my_page.dart”；
类索引扩展了StatefulWidget{
@凌驾
_IndexState createState（）=>new_IndexState（）；
}
类_IndexState使用TickerProviderStateMixin扩展状态{
int _currentIndex=0；
列出导航选项卡；
列表-页面列表；
StatefulWidget\u currentPage；
@凌驾
void initState（）{
super.initState（）；
_导航选项卡=[
新导航选项卡（图标：新图标（图标。帐户余额），标题：新文本（“主页”），vsync:this），
新导航选项卡（图标：新图标（Icons.local_mall），标题：新文本（“市场”），vsync:this），
新导航选项卡（图标：新图标（图标。帐户框），标题：新文本（“我”），vsync:this），
];
_页面列表=[
新网页（），
new MarketPage（），
新建MyPage（），
];
_currentPage=_页面列表[_currentIndex]；
}
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
正文：_当前页，
bottomNavigationBar：新的bottomNavigationBar(
items:_navigationTabs.map（（tab）=>tab.item.toList（），
currentIndex:_currentIndex，
固定颜色：颜色。蓝色，
类型：BottomNavigationBarType.fixed，
onTap：（int索引）{
设置状态（）{
_currentIndex=索引；
_当前页面=_页面列表[索引]；
});
},
),
);
}
}

//home\u page.dart
进口“包装：颤振/材料.省道”；
类主页扩展了StatefulWidget{
@凌驾
_HomePageState createState（）=>new_HomePageState（）；
}
类_HomePageState扩展状态{
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
appBar:首选大小(
孩子：新的AppBar(
标题：新文本（“主页”），
标题：对，
), 
首选尺寸：尺寸。从高度（40）
),
正文：新中心(
子项：新文本（“这是主页”，样式：TextStyle（fontSize:36）），
),
);
}
}

//market\u page.dart
进口“包装：颤振/材料.省道”；
导入“包：flatter_webview_plugin/flatter_webview_plugin.dart”；
类MarketPage扩展了StatefulWidget{
@凌驾
_MarketPageState createState（）=>new_MarketPageState（）；
}
类_MarketPageState扩展了状态{
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
appBar:首选大小(
孩子：新的AppBar(
标题：新文本（“市场”），
标题：对，
),
首选尺寸：尺寸。从高度（40）
),
正文：新WebviewScaffold(
url:“https://flutter.dev/",
withLocalStorage:true，
withJavascript:true
),
);
}
}

---

我希望webview页面保持活力，就像vue一样，我应该怎么做？

基本上，只要打开MarketPage小部件，它就会重新构建。您可以使用keep alive来实现所需的行为

//market_page.dart
import 'package:flutter/material.dart';
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';

class MarketPage extends StatefulWidget {

  @override
  _MarketPageState createState() => new _MarketPageState();

}

class _MarketPageState extends State<MarketPage> with AutomaticKeepAliveClientMixin{


  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: PreferredSize(
          child: new AppBar(
            title: new Text("market"),
            centerTitle: true,
          ),
          preferredSize: Size.fromHeight(40)
      ),
      body: new WebviewScaffold(
          url: "https://flutter.dev/",
          withLocalStorage: true,
          withJavascript: true
      ),
    );
  }

 @override
 bool get wantKeepAlive => true;

}

page1.省道

import 'package:flutter/material.dart';
import 'package:webview_project/pag1.dart';
import 'package:webview_project/page2.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0;
  var controller = PageController();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: PageView(
        physics: NeverScrollableScrollPhysics(),
        controller: controller,
        children: <Widget>[
          Page1(),
          Page2(),
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
          BottomNavigationBarItem(icon: Icon(Icons.web), title: Text('Web')),
        ],
        currentIndex: _currentIndex,
        onTap: (index) {
          setState(() {
            _currentIndex = index;
            controller.jumpToPage(index);
          });
        },
      ),
    );
  }
}

import 'package:flutter/material.dart';

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text('Page1'),
    );
  }
}

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

class Page2 extends StatefulWidget {
  @override
  _Page2State createState() => _Page2State();
}

class _Page2State extends State<Page2>
    with AutomaticKeepAliveClientMixin<Page2> {
  @override
  Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'https://www.flutter.dev/',
    );
  }

  @override
  bool get wantKeepAlive => true;
}

page2.省道

import 'package:flutter/material.dart';
import 'package:webview_project/pag1.dart';
import 'package:webview_project/page2.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0;
  var controller = PageController();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: PageView(
        physics: NeverScrollableScrollPhysics(),
        controller: controller,
        children: <Widget>[
          Page1(),
          Page2(),
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
          BottomNavigationBarItem(icon: Icon(Icons.web), title: Text('Web')),
        ],
        currentIndex: _currentIndex,
        onTap: (index) {
          setState(() {
            _currentIndex = index;
            controller.jumpToPage(index);
          });
        },
      ),
    );
  }
}

import 'package:flutter/material.dart';

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text('Page1'),
    );
  }
}

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

class Page2 extends StatefulWidget {
  @override
  _Page2State createState() => _Page2State();
}

class _Page2State extends State<Page2>
    with AutomaticKeepAliveClientMixin<Page2> {
  @override
  Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'https://www.flutter.dev/',
    );
  }

  @override
  bool get wantKeepAlive => true;
}

导入“包装：颤振/材料.省道”；
导入“package:webview_flatter/webview_flatter.dart”；
类Page2扩展了StatefulWidget{
@凌驾
_Page2State createState（）；
}
类_Page2State扩展状态
使用AutomaticEpaLiveClientMixin{
@凌驾
小部件构建（构建上下文）{
返回WebView(
初始URL:'https://www.flutter.dev/',
);
}
@凌驾
bool get wantKeepAlive=>true；
}

首先，感谢您的回答。然后我添加了你想要的代码，但是页面仍然会重新加载，我希望第二个页面的状态和滚动条位置与我应该添加的切换之前相同，我在这里讨论的重新加载指的是ui的重新呈现。我已经更新了答案。请检查一下。让我知道这是否适用于您。感谢您的回答，但它不适用于我的颤振应用程序。但您的回答给了我一些想法，我找到了有关AutomaticEpaLiveClientMixin的信息。这个答案帮助了我：谢谢大家~