javascript - 使用 jQuery 的 Dart JavaScript 互操作回调

Question

如何将以下 jquery 代码转换为 Dart？我很难使用 js.interop 使警报回调正常工作。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
  $(function () {
    $('p').hide('slow', function() {
      alert("The paragraph is now hidden");
    });
  });
</script>

感谢任何帮助。

Answer 1

感谢您的提问!我自己也不确定，但事实证明这是可能的。 :)

首先，将 js 添加到您的 pubspec.yaml 中:

name:  jquerydart
description:  A sample application

dependencies:
  js: any

然后，通过命令行或 Dart 编辑器运行 pub install。

然后，在你的 Dart 文件中:

import 'dart:html';
import 'package:js/js.dart' as js;

hideIsDone() {
  window.alert('all done!');
}

void main() {
  js.scoped(() {
    js.context.jQuery('p').hide(1000, new js.Callback.once(() => hideIsDone()));
  });
}

请注意，要从 JS 回调到 Dart，您需要创建一个回调对象。

另请注意，您不能使用 $ 作为 jQuery 变量，因为 dart2js 也使用 $。所以与此同时，您需要在 Dart 代码中使用 jQuery。

说了这么多，我们可以通过 JS-Dart 互操作来使用 jQuery 真是太酷了，但 Dart 真的应该为我们做这件事。所以我开了bug http://code.google.com/p/dart/issues/detail?id=6526