Question

JavaSscript：

<div class="row">
  <div class="col-md-4" style="background-color:burlywood;">MyColumn 1</div>
  <div class="col-md-4" style="background-color:chartreuse;">MyColumn 2</div>
  <div class="col-md-4" style="background-color:crimson;">MyColumn 3</div>
</div>

飞镖：

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

导致：

例外：TypeError：dart.global.MyClass不是构造函数

我还尝试将MyClass myClass = MyClass();和external MyClass();添加到带注释的external factory MyClass();类中，但是得到了相同的消息。如果将@JS()批注添加到interop类，则该异常消失，但无法访问实例成员。（但我不明白为什么这需要匿名注释）

我通过@anonymous使用dart 2.0.0，angular 5.0.0，js 0.6.1+1和dartdevc。

Answer 1

通常，JS互操作依赖于函数提升，以确保旧式JS类在范围内。但是，没有悬挂ES6类，也无法在Dart期望的地方使用它们。您可以通过几种不同的方式使Dart可以使用该类：

将类对象放在窗口上

这将类放置在与提升函数定义相同的范围内。在JavaScript中：

class MyClass { ... }

window.MyClass = MyClass;

创建模块对象

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

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

然后可以在Dart的myModule.myClass上访问哪个：

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

将Dart JS互操作与ES6类一起使用

1 个答案:

将类对象放在窗口上

创建模块对象