Как управлять HTML в Flutter webview?

#javascript #html #flutter #dart #flutterwebviewplugin

#javascript #HTML #flutter #dart #flutterwebviewplugin

Вопрос:

Я загружаю веб-сайт с помощью Flutter webview. Но я хочу заменить HTML-элемент при его загрузке. Например:

 <span class="name">Replace text</span>
  

Как это сделать?

Комментарии:

1. Привет, вы могли бы прикрепить обработчик к событию загрузки document.addEventListener("DOMContentLoaded", function() { // do my replacement });

2. @IronMan Что делать с Flutter webview?

Ответ №1:

Итак, это зависит от того, какую библиотеку вы используете для загрузки своего webview.

Я добился некоторого успеха, используя webview_flutter_plus (https://pub.dev/packages/webview_flutter_plus ).

При этом вам просто нужно дождаться загрузки вашего html и ввести некоторый javascript, чтобы изменить любой html, который вы хотите.

Вот так:

 Widget build(BuildContext context) {
    return WebViewPlus(
        initialUrl: myUrl,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: (WebViewPlusController webViewController) {
            _webViewController = webViewController;
        },
        onPageFinished: (String url) {
            _webViewController.evaluateJavascript('document.querySelector(".name").innerHTML = "new text";');
        }
   }
}
  

Комментарии:

1. дорогой @Didier Prophete Я использую этот способ, но, похоже, оценка скрипта jave занимает слишком много времени, что я мог с этим поделать

2. Да. Правда в том, что создание webview внутри собственного приложения в flutter занимает некоторое время (например, полсекунды). После этого я думаю, что оценка js в порядке, но это начальное время — огромная боль. Не уверен, что мы можем многое там сделать, пока сам flutter не улучшит производительность webview (и там тоже, я не уверен, что flutter может что-то сделать. Возможно, webview — это дорогостоящий класс для создания экземпляра …)

3. Дорогой, есть ли способ, которым я мог бы не показывать webview до тех пор, пока он не оценит, я имею в виду, что оценка происходит при обратном вызове onpagefinished и что для его запуска требуется некоторое время

4. да, @kikicoder, это именно то, что я делаю в своем собственном коде. Я в основном скрываю webview (я помещаю его в стек под заставкой), пока не будет вызван onPageFinished …