TypeScriptExample 组件使用 ts-blank-space ↗ 从您的示例中移除 TypeScript 特定的语法并提供一个 JavaScript 标签页。这通过只需维护单个示例来减少维护负担。
当 lang 设置为 ts 时，此组件会自动在 GitHubCode 组件中使用。
import { TypeScriptExample } from "~/components";
<TypeScriptExample code={{
collapse: "1-2"
}}>
```ts
// comment to demonstrate
// collapsible sections
interface Environment {
KV: KVNamespace;
}
export default {
async fetch(req, env, ctx): Promise<Response> {
if (req !== "POST") {
return new Response("Method Not Allowed", {
status: 405,
headers: {
"Allow": "POST"
}
});
}
await env.KV.put("foo", "bar");
return new Response();
}
} satisfies ExportedHandler<Environment>
```
</TypeScriptExample>类型：string
一个可选的文件名，以 .ts 结尾。
.ts 将在 JavaScript 标签页中被替换为 .js。
类型：boolean
如果设置为 true，将在 JavaScript 标签页上显示 Run Worker in Playground 按钮。
类型：object
传递给 Expressive Code 组件 ↗的 Props。
这些 props 将应用于这两个代码块，因此像 collapse 这样的选项可能无法按预期工作，因为行可能会从 TypeScript 代码中移除。