使用 Typescript 扩展传单标记

Question

我正在开发一个使用 Typescript 和 Leaflet 的项目。

扩展传单标记的记录（JS）方法如下：

L.Marker.Foo = L.Marker.extend({...});

然而，Typescript 抱怨：

Property 'Foo' does not exist on type 'typeof Marker'.

如何更改它以避免编译错误？

Answer 1

像这样扩展标记：

 export class TSMarker extends L.Marker {
        options: L.MarkerOptions

        constructor(latLng: LatLngExpression, options?: L.MarkerOptions) {
            super(latLng, options)
        }

        greet(): this {
            this.bindPopup("Hello! TSX here!")
            return this
        }

    }

来源

Answer 2

好的，所以我一直在努力解决这个问题，我想我已经解决了：

假设我有这个：

// MyExtendedMarker.ts

const MyExtendedMarker = Marker.extend({
  foo: function() {
    // do stuff
  },
  bar: "hello!"
})

然后我在我的index.d.ts中创建了以下内容：

// index.d.ts

/// <reference types="leaflet" />

declare class MyExtendedMarker extends L.Marker {
  foo(): void;
  bar: string;
}

当我使用我创建的类时，我得到了正确的类。我什至最终更改了构造函数以传递我自己的选项类型（我也扩展了它）。

我故意避免了

class MyExtendedMarker extends Marker

的新风格，因为这违背了Leaflet的推荐方式，因为它们的类是ES5风格的类。