From e7c96363a1963b7733a9ee498403eb6a062160e6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= <netfan@foxmail.com>
Date: Wed, 18 Aug 2021 20:52:34 +0800
Subject: [PATCH] fix(code-editor): fixed formatting error
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复JSON编辑器在格式化无效JSON文本时会抛出异常的问题
---
 CHANGELOG.zh_CN.md                           |  1 +
 src/components/CodeEditor/src/CodeEditor.vue | 20 ++++++++++++++------
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index 365009c0..f720a9bf 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -4,6 +4,7 @@
 
 ### 🐛 Bug Fixes
 
+- **CodeEditor** 修复 JSON 编辑器在格式化无效 JSON 文本时会抛出异常的问题
 - **其它**
   - 修复部分封装组件在使用插槽时报错的问题
   - 修复`useECharts`的`theme`参数不起作用的问题
diff --git a/src/components/CodeEditor/src/CodeEditor.vue b/src/components/CodeEditor/src/CodeEditor.vue
index 2818e58b..552af01f 100644
--- a/src/components/CodeEditor/src/CodeEditor.vue
+++ b/src/components/CodeEditor/src/CodeEditor.vue
@@ -25,18 +25,26 @@
     value: { type: [Object, String] as PropType<Record<string, any> | string> },
     mode: { type: String, default: MODE.JSON },
     readonly: { type: Boolean },
+    autoFormat: { type: Boolean, default: true },
   });
 
-  const emit = defineEmits(['change', 'update:value']);
+  const emit = defineEmits(['change', 'update:value', 'format-error']);
 
   const getValue = computed(() => {
-    const { value, mode } = props;
-    if (mode !== MODE.JSON) {
+    const { value, mode, autoFormat } = props;
+    if (!autoFormat || mode !== MODE.JSON) {
       return value as string;
     }
-    return isString(value)
-      ? JSON.stringify(JSON.parse(value), null, 2)
-      : JSON.stringify(value, null, 2);
+    let result = value;
+    if (isString(value)) {
+      try {
+        result = JSON.parse(value);
+      } catch (e) {
+        emit('format-error', value);
+        return value as string;
+      }
+    }
+    return JSON.stringify(result, null, 2);
   });
 
   function handleValueChange(v) {