webview - Flutter：webview_flutter更新同一webview小部件中的URL(Flutter: webview_flutter update url in same webview widget)

Question

Hey I am trying to create a screen which shows a webview with a bottomappbar.

(嗨，我正在尝试创建一个屏幕，该屏幕显示带有bottomappbar的Web视图。)

So you load the webview and when tapping on a item in the bottomappbar a other website should loaded in the same webview...

(因此，您加载了webview，并且在底部应用栏中点击一个项目时，另一个网站应该加载在相同的webview中...)

I cant figure out how to open another website other than I originaly parsed.

(除了最初解析的内容外，我无法弄清楚如何打开其他网站。)

I tried to update the url by using ?setState? but it only updates the appbar title and the webview still shows the original website

(我尝试使用《 setState》更新网址，但它仅更新应用程序栏标题，并且webview仍显示原始网站)

Here is my current code:

(这是我当前的代码：)

class _WebviewContainer extends State<WebviewContainer> {

var url;
final key = UniqueKey();

_WebviewContainer(this.url); 

@override
Widget build(BuildContext context) {    
return Scaffold(
  appBar: AppBar(
    title: Text(url),
    actions: <Widget>[
      IconButton(
        icon: Icon(
          Icons.home,
          size: 40.0,
          color: Colors.white,
        ),
        onPressed: () => {
          //-> Here I set the new url but the webview always shows the origin website

          setState(() {
            url = 'https://stackoverflow.com/';
          })
        },
      )
    ],
  ),
  body: Column(
    children: <Widget>[
      Expanded(
        child: WebView(
          key: key,
          javascriptMode: JavascriptMode.unrestricted,
          initialUrl: url,              
        ),
      ),          
    ],
  ),
);
}
}

I took the code from a tutorial on YouTube and the creator also stated that the webview will reload if the state of the url changes, but unfortunately he did not show how to do it

(我从YouTube上的一个教程中获取了代码，创建者还表示，如果url的状态发生更改，则将重新加载Webview，但是很遗憾，他没有展示如何执行此操作)

If anybody could help me out?

(是否有人可以帮助我？)

Thanks in advance Doobie

(在此先感谢Doobie)

  ask by DoobieAsDave translate from so

Answer 1

So I had a similar situation except i wanted a new url to be loaded in my webview when i selected an item from a dropdownmenu.

(所以我遇到了类似的情况，只是当我从下拉菜单中选择一个项目时，我希望在Web视图中加载一个新的URL。)

How I did this was create an instance of WebViewController

(我是如何创建WebViewController的实例的)

WebViewController controller;

Then set this controller when the webview is created with the onWebViewCreated parameter

(然后在使用onWebViewCreated参数创建Web视图时设置此控制器)

child: WebView(
      key: _key,
      javascriptMode: JavascriptMode.unrestricted,
      initialUrl: url,
    onWebViewCreated: (WebViewController webViewController) {
    controller = webViewController;}

Now you have the controller set, you can use its loadUrl method in setState() to change the displayed Url

(现在已经设置了控制器，可以在setState（）中使用其loadUrl方法来更改显示的Url)

setState(() {                
            controller.loadUrl(newUrl_here);

I just started with Flutter so could be a better way of course but this worked for me

(我刚开始使用Flutter，所以当然可能是更好的方法，但这对我有用)