TypeScript:扩展接口和悬停提示 [英] TypeScript: extending interfaces and hover hints

问题描述

我正在使用VSCode中的TypeScript.我有三个接口: A ， B 和 C ，每个接口都有两个属性. C 扩展了 A 和 B .

 接口A {A1:布尔值；A2:布尔值；}接口B {B1:布尔值；B2:布尔值；}接口C扩展了A，B {C1:布尔值；C2:布尔值；}const ABC:C = {A1:是的，A2:是的，B1:是的，B2:是的，C1:是的，C2:是的，};console.log(ABC); 

当我将鼠标悬停在 C 上时，我只会看到它自己的属性.

这不方便，因为当我对任何对象使用 C 时，我在代码库中看不到整个接口.

这是故意的吗?

解决方案

这是因为，否则，当扩展功能更丰富的界面(例如 HTMLELement )时，您的预览会with肿，具有与之无关的属性您的界面.如果您确实需要索引 C 的所有可用属性，只需编写 ABC.(如果什么也没有发生，请尝试 ctrl + space ).或在 C 上单击 ctrl +单击来查看其声明，然后在 A 或 B 上单击以进行检查.

I am working with TypeScript in VSCode. I have three interfaces: A, B and C, each one with two properties. C extends A and B.

interface A {
  A1: boolean;
  A2: boolean;
}

interface B {
  B1: boolean;
  B2: boolean;
}

interface C extends A, B {
  C1: boolean;
  C2: boolean;
}

const ABC: C = {
  A1: true,
  A2: true,
  B1: true,
  B2: true,
  C1: true,
  C2: true,
};

console.log(ABC);

When I hover C I only see its own properties.

This is not convenient, as I can't see the whole interface in the codebase when I use C for any object.

Is this intended?

解决方案

This is intended because otherwise when extending a more safisticated interface (like HTMLELement) your preview would get bloated with properties not inheritly relevant to your interface. If you really need an index of all avaliable properties of C, just write ABC. (when nothing happens try ctrl+space). Or ctrl+click on C to see its declaration and further on A or B to inspect those.

这篇关于TypeScript:扩展接口和悬停提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！