diff --git a/src/components/CodeEditor/index.ts b/src/components/CodeEditor/index.ts index a9b0c30e..872bfedf 100644 --- a/src/components/CodeEditor/index.ts +++ b/src/components/CodeEditor/index.ts @@ -4,3 +4,5 @@ import jsonPreview from './src/json-preview/JsonPreview.vue'; export const CodeEditor = withInstall(codeEditor); export const JsonPreview = withInstall(jsonPreview); + +export * from './src/typing'; diff --git a/src/components/CodeEditor/src/CodeEditor.vue b/src/components/CodeEditor/src/CodeEditor.vue index 2bb0fc45..db9042b5 100644 --- a/src/components/CodeEditor/src/CodeEditor.vue +++ b/src/components/CodeEditor/src/CodeEditor.vue @@ -12,11 +12,18 @@ import { computed } from 'vue'; import CodeMirrorEditor from './codemirror/CodeMirror.vue'; import { isString } from '/@/utils/is'; - import type { MODE } from './typing'; + import { MODE } from './typing'; const props = defineProps({ value: { type: [Object, String] as PropType | string> }, - mode: { type: String, default: MODE.JSON }, + mode: { + type: String as PropType, + default: MODE.JSON, + validator(value: any) { + // 这个值必须匹配下列字符串中的一个 + return Object.values(MODE).includes(value); + }, + }, readonly: { type: Boolean }, autoFormat: { type: Boolean, default: true }, }); diff --git a/src/components/CodeEditor/src/codemirror/CodeMirror.vue b/src/components/CodeEditor/src/codemirror/CodeMirror.vue index 5a4462fc..426ac36e 100644 --- a/src/components/CodeEditor/src/codemirror/CodeMirror.vue +++ b/src/components/CodeEditor/src/codemirror/CodeMirror.vue @@ -8,6 +8,7 @@ import { useAppStore } from '/@/store/modules/app'; import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn'; import CodeMirror from 'codemirror'; + import { MODE } from './../typing'; // css import './codemirror.css'; import 'codemirror/theme/idea.css'; @@ -18,7 +19,14 @@ import 'codemirror/mode/htmlmixed/htmlmixed'; const props = defineProps({ - mode: { type: String, default: 'application/json' }, + mode: { + type: String as PropType, + default: MODE.JSON, + validator(value: any) { + // 这个值必须匹配下列字符串中的一个 + return Object.values(MODE).includes(value); + }, + }, value: { type: String, default: '' }, readonly: { type: Boolean, default: false }, }); diff --git a/src/components/CodeEditor/src/typing.ts b/src/components/CodeEditor/src/typing.ts index e9f99d57..34b5ed1f 100644 --- a/src/components/CodeEditor/src/typing.ts +++ b/src/components/CodeEditor/src/typing.ts @@ -1,5 +1,5 @@ -export const MODE = { - JSON: 'application/json', - html: 'htmlmixed', - js: 'javascript', -}; +export enum MODE { + JSON = 'application/json', + HTML = 'htmlmixed', + JS = 'javascript', +} diff --git a/src/views/demo/editor/json/index.vue b/src/views/demo/editor/json/index.vue index ada1d5b3..f370ac57 100644 --- a/src/views/demo/editor/json/index.vue +++ b/src/views/demo/editor/json/index.vue @@ -15,7 +15,7 @@