使用 Dart JS 与 ES6 类的互操作

Question

Java脚本：

class MyClass {

    constructor() {
        console.log("MyClass instance created");
        this.answer = 42;
    }
}

let example = new MyClass();
console.log(example.answer);

镖：

@JS()
library interop_test;

import 'package:js/js.dart';

@JS()
class MyClass {
  external int get answer;
  external set answer(int value);
}

创建互操作类的实例MyClass为

MyClass myClass = MyClass();

结果是：

异常：类型错误：dart.global.MyClass 不是构造函数

我还尝试将 和 添加external MyClass();到external factory MyClass();带@JS()注释的类中，但收到了相同的消息。如果我@anonymous向互操作类添加注释，异常就会消失，但我无法访问实例成员。（但我不明白为什么这需要匿名注释）

我正在使用dart 2.0.0、angular 5.0.0和js 0.6.1+1通过dartdevc。webdev

Answer 1

通常，JS 互操作将依赖函数提升来确保旧式 JS 类在范围内。然而，ES6 类没有被提升，并且在 Dart 期望的地方不可用。有几种不同的方法可以使该类可供 Dart 使用：

将类对象放置在窗口上

这会将类置于函数定义将提升到的相同作用域中。在 JavaScript 中：

class MyClass { ... }

window.MyClass = MyClass;

创建模块对象

您还可以将该类放置在某种伪模块或命名空间中。在 JavaScript 中：

class MyClass { ... }
var myModule = { MyClass: MyClass };

然后可以在myModule.myClassDart 中访问：

@JS('myModule.myClass')
class MyClass { ... }