timi-tdesign-mobile/docs/components/code-editor.md

CodeEditor 代码编辑器

带行号、语法高亮与查找替换的代码输入框。

基础用法

:::preview 基础用法 || 通过 v-model 绑定内容，实例暴露 openSearch 等方法

demo-preview=../demos/code-editor/basic.vue

:::

何时使用

需要让用户输入或查看结构化代码时使用。它不做代码校验，只负责输入、高亮与检索。

内容绑定

modelValue 与 value 都可作为输入源，value 优先级更高。输入时同步抛出 update:modelValue 与 change。

实例方法

通过模板引用调用暴露的方法，例如打开查找栏：

import type { CodeEditorExpose } from "timi-tdesign-mobile";

const editorRef = ref<CodeEditorExpose>();
editorRef.value?.openSearch(true);

移动端受限于宽度，代码行会横向滚动而不是折行。

API