有没有办法在 TypeScript 的界面中记录字段？

Posted 2023-03-13

【中文标题】有没有办法在 TypeScript 的界面中记录字段？

【英文标题】：Is there a way to document fields in an interface in TypeScript?

【发布时间】：2019-01-09 12:03:56

【问题描述】：

假设我有以下内容：

interface Validator 
  validate: (value: string) => boolean;
  errorMessage: string;


interface EditDialogField 
  label: string;
  prop: string;
  required?: boolean;
  type: 'input';
  validators?: Validator[];

这很有用，因为 IntelliSense 在我使用这些接口时会弹出建议，但我希望能够添加也显示在 IntelliSense 中的 cmets（特别是 VS Code）。这可能吗？

【问题讨论】：

Where is the syntax for TypeScript comments documented?的可能重复

【参考方案1】：

知道了！

interface EditDialogField 
  /** Explain label here */
  label: string;
  /** Explain prop here */
  prop: string;
  required?: boolean;
  type: 'input';
  validators?: Validator[];

【讨论】：

您能否确认它是否仅适用于//？我猜/** 是唯一有效的语法？

可以确认这在 VSCode 中有效，但在 tsdoc.org 上找不到它的文档

/** comment */ 在选中 Editor > Appearance > Show documentation popup 时会显示在 intelliJ IDEA 中。

VSCode 中的哪些设置可以让那些显示为悬停提示？

【参考方案2】：

如果您想在鼠标悬停在编辑器中时看到它出现，我建议您记录界面并在文档注释中使用@field。

您也可以使用@member，这可能会为文档提供更好的语法突出显示

/**
 * This is the description of the interface
 *
 * @interface EditDialogField
 * @member string label is used for whatever reason
 * @field string prop is used for other reason
 */
interface EditDialogField 
  label: string;
  prop: string;
  required?: boolean;
  type: 'input';
  validators?: Validator[];

VSCode 中的结果