时间戳

首页 > 解决方案 > 如何在 dart 中使用 javascript 库

javascript - 如何在 dart 中使用 javascript 库

问题描述

我正在学习package:js和dart 文件，它是 chart.js 的 dart 包装器。

我认为这个文件是连接 dart 和 javascript 的桥梁。所以，在这个文件中，它必须告诉这个 dart 文件试图连接的 javascript 库。我对吗？但我没有找到。

以下陈述是什么意思？以下两个语句是否说明了这个 dart 文件试图连接的 javascript 库？

@JS('Chart')
library chart.js;

我不知道如何将函数https://github.com/google/chartjs.dart/blob/master/lib/chartjs.dart映射到 https://cdnjs.cloudflare.com/ajax/libs/Chart 中的函数。 js/2.6.0/Chart.js。谁能给更多的教程？

标签： javascriptdartchart.jsdart-js-interop

解决方案

您不需要映射到 JavaScript文件，您只需要映射到 JS 对象和函数。

您需要添加一个脚本标签来index.html加载您要映射到的 JavaScript 文件，这将使其全局可用。

然后你需要映射

  • Dart 函数到 JavaScript 函数，所以当你调用这样的 Dart 函数时，调用实际上会被转发到 JavaScript 函数。

  • Dart 类，以便您可以使用强类型的 Dart 类，然后当您将它们作为参数传递给映射函数或从此类函数调用中获取它们作为返回值时，这些类将与 JavaScript 对象相互转换。

@JS('Chart')
library chart.js;

chart.js后面的名字library是任意的。该library指令只需要一个唯一的名称。

@JS('Chart')表示加载的 chart.js 库在 JavaScript 领域中可用window.Chart（window表示 JS 领域中的全局并且是隐式的）。

@JS()
class Chart {

声明一个 Dart 类Chart，并将@JS()其映射到上面声明的库范围内同名的 JS 类。所以 Dart 类Chart将映射到 JavaScript 类window.Chart.Chart。

external factory Chart(

external ...Dart类中的声明Chart映射到同名的 JS 方法。

更多细节可以在 README.md https://pub.dartlang.org/packages/js中找到。

如果您仍然卡住，您可以提出更具体的问题。很难回答有关如何使用包的一般问题。

推荐阅读