在Flutter Webview中运行一些Javascript文件，如index.js

Question

如何在flatter_webview_插件中运行Javascript文件。我用这个试试。

flutterWebViewPlugin.evalJavascript("require('./index.js');");

但什么也没发生。

当我试图运行flutter代码时，它什么也显示不出来

我的索引。Js文件包含一个简单的警报语句

alert('hello world');

Answer 1

首先，你使用了“需要”函数。这个函数不是在javascript中实现的。它是NodeJs的一部分。所以这个函数不会工作。

为了将JS文件加载到颤动中，应将其视为文本文件并正确加载。因此，您需要将该文件添加到资产文件夹中，添加到pubspec文件中，然后加载它。在这里阅读完整答案

其次，您使用了evalJavascript。此功能可用于许多不同的情况。但只有当您有一个视图面板时，它才能工作。

检查下面的例子：

import 'dart:io';

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

main() async {
  String jsCode = await rootBundle.loadString('assets/javascript.js');

  runApp(new MaterialApp(
    home: LunchWebView(jsCode),
  ));
}

class LunchWebView extends StatelessWidget {
  final String text;
  LunchWebView(this.text);

  @override
  Widget build(BuildContext context) {
    final FlutterWebviewPlugin flutterWebviewPlugin = FlutterWebviewPlugin();
    flutterWebviewPlugin.launch('https://www.google.com');
    flutterWebviewPlugin.evalJavascript(text);
    return Container();
  }
}

注意：我没有处理重载和其他异常。您应该检查是否有任何webview对象打开，然后调用午餐方法。