将模块中的接口用作类中的字段时出现Typescript错误

2023年11月11日 286次阅读

我正在为fabric.js提供一个类型定义文件.一般结构如下所示：

declare module fabric {
   export interface Canvas {
      selectionBorderColor: string;
      selectionColor: string;
      ...
   }

   var Canvas: {
      new (): Canvas;
   }
}

这种模式允许我以“类似接口”的方式使用fabric.Canvas,以便变量与fabric.Canvas接口相关联.同时它允许我调用“静态成员”(例如fabric.Canvas的构造函数).

但是,当在类中使用接口“fabric.Canvas”时,这会导致问题.以下示例显示了这种情况：

将接口放在模块中时,只会出现此问题,否则一切正常.

解决这个问题的方法有哪些

最佳答案 有一些类型混淆,因为你有一个接口和一个具有相同名称的字段 – 我知道这在lib.d.ts文件中很常见,但我认为在编写新的TypeScript代码时这不是一个好习惯.这似乎是定义现有代码的必要条件.

如果将var Canvas重命名为var MyCanvas(或其他任何内容),则代码可以正常工作.

我倾向于在我的接口前面添加一个I,例如ICanvas – 但这不是TypeScript约定(尚未).

declare module fabric {
   export class Canvas {
      selectionBorderColor: string;
      selectionColor: string;
   }
}

class MyClass {
    canvas: fabric.Canvas;
}
点赞