Docz:如何将接口以外的Typescript定义呈现为属性

Question

我们正在用Docz记录我们的类型定义。对于接口，它一直工作得很好，然而，除了将接口作为道具提供给Docz组件之外，它似乎不会呈现任何东西。

我想知道如何呈现枚举或联合类型，并使其能够在mdx中呈现。

在docz文件中使用它们的方式如下所示：

interface.tsx：

import {
  UserOrganisation,
  UserLevel
} from "~/packages/database-interfaces/src";

export const UserLevelC = (props: UserLevel) => {};
export const UserOrganisationC = (props: UserOrganisation) => {};

index.mdx：

---
name: users
menu: Database/Realtime
---

import { Props } from "docz";
import {
  UserLevelC,
  UserOrganisationC
} from "./Interface.tsx";


# Interface

## Properties

### Type UserOrganisation

<Props of={UserOrganisationC} />

### Type UserLevel

<Props of={UserLevelC} />

类型定义如下：

export const enum UserLevel {
  "employee",
  "owner",
  "admin",
  "disabled"
}

export interface UserOrganisation {
  level: UserLevel;
  name: string;
}

这样呈现(注意下面的'UserLevel‘类型，它只是呈现为一条水平线)：

​

​

作为参考，我们还尝试了定义/导出以下方法：

export type foo = 'option1' | 'option2';
export enum foo = 'option1' | 'option2';
export const enum foo = 'option1' | 'option2';

正如您所看到的，接口被呈现，但不是这个类型/枚举等。

奇怪的是，如果相同类型的枚举字符串/联合类型被声明为接口的属性，而不是它自己的类型：

export interface UserOrganisation {
  level: 'employee' | 'owner' | 'admin' | 'disabled';
  name: string;
}

Docz可以在渲染界面时显示它，如下所示：

​

​

然而，当你试图将它提取到它自己的类型中(我们需要这样做，因为这个和其他一些接口在多个地方被其他接口使用)时，什么都不呈现。

如有任何帮助，将不胜感激，谢谢！

Answer 1

因为level: 'employee' | 'owner' | 'admin' | 'disabled';可以工作，所以可以这样声明类型：

type UserLevel = 'employee' | 'owner' | 'admin' | 'disabled';