From dfdfca656b0bafb835fdc607325637f48de082e7 Mon Sep 17 00:00:00 2001
From: Renkin <906155099@qq.com>
Date: Thu, 5 Sep 2024 15:54:27 +0800
Subject: [PATCH] =?UTF-8?q?chore:=20=E8=B0=83=E6=95=B4=E6=96=87=E6=A1=A3?=
 =?UTF-8?q?=E4=B8=AD=E7=A4=BA=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/demo/examples/Interactive/demo.vue | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/docs/demo/examples/Interactive/demo.vue b/docs/demo/examples/Interactive/demo.vue
index c640eda..04910d2 100644
--- a/docs/demo/examples/Interactive/demo.vue
+++ b/docs/demo/examples/Interactive/demo.vue
@@ -7,6 +7,8 @@
     class="cm-component"
     :border="store.border"
     @ready="onReady"
+    @blur="onBlur"
+    @focus="onFocus"
   />
 </template>
 <script lang="ts" setup>
@@ -40,6 +42,7 @@ const cmOptions: EditorConfiguration = reactive({
   scrollbarStyle: "simple",
   showCursorWhenSelecting: true,
   styleSelectedText: true,
+  styleActiveLine: false,
 });
 
 const cminstance = ref<Editor | null>(null);
@@ -48,6 +51,17 @@ const onReady = (cm: Editor) => {
   console.log(cm.getValue());
 };
 
+/** @description  */
+const onBlur = (cm: Editor) => {
+  console.log(" onBlur", cm);
+  cm.setOption("styleActiveLine", false);
+};
+/** @description  */
+const onFocus = (cm: Editor) => {
+  console.log(" onBlur", cm);
+  cm.setOption("styleActiveLine", true);
+};
+
 const _fontSize = computed(() => store.fontSize || "13px");
 const _lineHeight = computed(() => store.lineHeight || "20px");