Question

我正在尝试使用js 0.6.0 interrop库从Dart使用LeafletJS。我创建了以下Dart文件来映射基本Leaflet映射的构造。

@JS("L")
library leaflet;

import "dart:html";
import "package:js/js.dart";

@JS("map")
class LeafletMap {
   external factory LeafletMap(Element element);
}

然后我在main.dart

中使用这些类

import 'dart:html';
import 'package:charm/leaflet.dart';

main() {
   var e = querySelector("#map");
   var m = new LeafletMap(e);
}

这相当于下面的Javascript，它将创建并显示具有默认配置的地图。

var map = L.map('map');

HTML如下所示，包含leaflet.js javascript文件。

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
  <script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>

  <script src="main.dart" type="application/dart"></script>
  <script src="packages/browser/dart.js"></script>
</head>
<body>
  <div id="map"></div>
</body>
</html>

浏览器控制台中显示以下错误：

Uncaught TypeError: L.map is not a function

但是，如果我直接在浏览器中使用控制台，则L.map作为一个函数存在。不确定我是否正确使用了JS interrop库，并且不胜感激。

Answer 1

你面对known issue基本上是与缩小的dart2js名称发生冲突。

Answer 2

我认为这应该做你想做的事情

context.MapRoute(
            "AreaN_default",
            "AreaN/{controller}/{action}/{id}",
            new { action = "Index", id = UrlParameter.Optional },
            new string[] { "Namespace" }
        );

我不知道函数会返回什么。

Dart JS 0.6与Leafletjs交互导致类型错误

2 个答案: