个人中心
gpt4 book ai didi

flutter - 如何使用 dart :js? 将选项传递给 javascript 函数

转载 作者：行者123 更新时间：2023-12-03 02:42:27 25 4
gpt4 key购买 nike

我有以下功能性 javascript 代码来演示我想要实现的目标。它应该输出传递给方法的对象，然后是属性“a”的值。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <script>
    window.theObjectCall = function(x) {
      console.log(x);
      console.log(x.a);
    }
  </script>
  <script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
我有以下 dart 代码，它可以工作，但是“a”无法按我的预期访问。 
@JS('window')
library whatever;

import 'dart:js';

import 'package:js/js.dart';

@JS('theObjectCall') // Accessing method getCurrentPosition from Geolocation API
external void theJsObjectCall(JsObject theObject);

void someJsCallWithObject() {
  var object = JsObject(context['Object']);
  object['a'] = 'xxx';
  theJsObjectCall(object);
}

在控制台中执行以下日志“未定义”。
enter image description here

最佳答案

您应该单独定义您的对象，如下面的示例所示。原因是 javascript 对 Dart 类不透明，包括 JSObject .正如文档所暗示的那样，它只是一个代理，可让您访问 Dart 中的 js 对象属性。我不确定你是否可以使用它。
但是，如果您已经知道要传递的对象的结构，那么您可以使用该结构定义一个匿名类并将定义的 JS 函数传递给它。然后 dart2js 会适本地处理转换。

@JS('window')
library whatever;

import 'dart:js';

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

@JS('theObjectCall') // Accessing method getCurrentPosition from Geolocation API
external void theJsObjectCall(ObjectYouWantToSend theObject);

void someJsCallWithObject() {
  ObjectYouWantToSend oywts = ObjectYouWantToSend(a: 'xyz');
  theJsObjectCall(oywts);
}

@JS()
@anonymous
class ObjectYouWantToSend {
  external factory ObjectYouWantToSend({
    String a,
  });
  external String get a;
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          child: Center(
            child: FlatButton(
              onPressed: someJsCallWithObject,
              child: Text('Call The js Function.'),
            ),
          ),
        ),
      ),
    );
  }
}

你可以在我的 repo 中找到代码.
这是部署时的样子。
enter image description here

关于flutter - 如何使用 dart :js? 将选项传递给 javascript 函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/64373231/

25 4 0
文章推荐： flutter - 如何在 flutter 中绘制带有尖头/渐变线/的线？
文章推荐： list - Flutter 计算其类别中商品的总价
文章推荐： gradle - 使用gradle依赖项时如何排除多个组
文章推荐： Gradle : gradlew expecting in
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com