CodeBlock

文档

通用代码块组件，支持复制代码与通过 highlightElement 外部注入的语法高亮

Component Demo

Basic usage and examples of the CodeBlock component

基础用法

const answer = 42;

带标题

answer.ts

const answer = 42;

指定语言

<div>Hello</div>

隐藏复制按钮

const total = 1 + 2;

外部注入高亮

const answer = 42;

实时高亮

const answer = 42;

API Documentation

Complete API reference for the CodeBlock component

Props属性名类型默认值描述
codestring-要高亮显示的源代码
highlightElement(element: HTMLElement) => void-语法高亮函数，接收待高亮的代码元素；不传则不进行高亮
languagestring'typescript'代码语言，用于语法高亮
showCopyButtonbooleantrue是否显示复制按钮
titlestring-代码块顶部标题

属性名	类型	默认值	描述
`code`	`string`	-	要高亮显示的源代码
`highlightElement`	`(element: HTMLElement) => void`	-	语法高亮函数，接收待高亮的代码元素；不传则不进行高亮
`language`	`string`	`'typescript'`	代码语言，用于语法高亮
`showCopyButton`	`boolean`	`true`	是否显示复制按钮
`title`	`string`	-	代码块顶部标题