flutter调用js代码

本文介绍了如何在Flutter应用中通过dart:js库调用web包下的JavaScript函数,包括无参和带参调用,并详细解释了import'dart:js'的含义。同时,探讨了如何正确引用和导入其他外部JavaScript资源如jQuery。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

首先需要在pubspec.yaml中配置:

dependencies:
  js: ^0.6.1+1 #主要是指明这个,可以根据实际情况配置版本
  flutter:
    sdk: flutter

然后直接看代码,在lib包下的任意的目录新建一个dartjs.dart文件,代码如下:

import 'dart:js' as js;
void main() {
  //示例调用测试函数test.js
  print(js.context.callMethod("noparam")); //带参数
  print(js.context.callMethod("haveparam", ["hello world"]));//无参数
  //示例调用cryptUtil.js
  String cipher = js.context.callMethod("encryptByDES", ["hello world"]);
  print(cipher);
  print(js.context.callMethod("decryptByDES", [cipher]));
}

工程目录如下图所示,调用的关键在于web包下面的index.html和我们自己新建的js,什么意思呢,也就是说我们写的js必要在index.html中引入才能被调用到,引入的代码就忽略了,想调用什么别的包都可以的,例如jquery
![image.png](https://img-blog.csdnimg.cn/img_convert/21a1ab82c01db3af47dbbe344c25fb58.png#align=left&display=inline&height=406&margin=[object Object]&name=image.png&originHeight=812&originWidth=560&size=55062&status=done&style=shadow&width=280)
最后回到示例代码的第一行,这个import代码的意思是把web包下面的js文件夹下面的所有js引进来。这样问题就很明确了。

import 'dart:js' as js;
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值