从 Dart 调用 js

Question

我如何从 Dart 中调用这样的代码？

$('.datepicker').datepicker();

我知道我可以使用“package:js/js.dart”包调用函数，如下所示

@JS("Plotly.plot")
external plot(DivElement element, List<PlotData> plotData, Margin margin);

...但是在元素上调用函数？

Answer 1

这并不是 100% 清楚你在问什么，但我认为你在问如何在 JS 对象上调用任意方法。做到这一点并不容易（最好编写类型化接口）。您有两个选择：

1. 使用package:js/js_util.dart并调用callMethod.
2. 为您想要的内容写一个@JS()- 注释。class

对于第一个，您可以编写以下内容：

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

void openDatePicker(Object elements) {
  js.callMethod(elements, 'datepicker', []);
}

...不是超级优雅（或打字良好），但它有效。仅当您确实只需要调用单个方法并且不希望调用其他方法或传递复杂参数时，我才建议这样做。

对于后者，你仍然可以使用@JS()技术。例如：

@JS()
external JQueryElements $(String selector);

@JS()
// Because this doesn't "really" align to a class in the JS/DOM.
@anonymous
abstract class JQueryElements {
  @JS()
  external void datepicker();
}

...你可以这样使用它：

void main() {
  $('.datepicker').datepicker();
}