fix: replace v-bind="$attrs" with v-bind="editorAttrs" for improved attribute handling

Author: liuruibin

ui/src/components/codemirror-editor/index.vue

@@ -7,7 +7,7 @@
       :style="codemirrorStyle"
       :tab-size="4"
       :autofocus="true"
-      v-bind="$attrs"
+      v-bind="editorAttrs"
     />
 
     <div class="codemirror-editor__footer">
@@ -39,14 +39,15 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch, useAttrs } from 'vue'
 import { Codemirror } from 'vue-codemirror'
 import { python } from '@codemirror/lang-python'
 import { oneDark } from '@codemirror/theme-one-dark'
 import { linter, type Diagnostic } from '@codemirror/lint'
 import FunctionApi from '@/api/function-lib'
 
 defineOptions({ name: 'CodemirrorEditor' })
+const editorAttrs = useAttrs() as any
 
 const props = defineProps<{
   title: String

ui/src/components/dynamics-form/items/JsonInput.vue

@@ -1,7 +1,7 @@
 <template>
   <div style="width: 100%" class="function-CodemirrorEditor">
     <Codemirror
-      v-bind="$attrs"
+      v-bind="editorAttrs"
       ref="cmRef"
       v-model="model_value"
       :extensions="extensions"
@@ -51,7 +51,7 @@ import { json, jsonParseLinter } from '@codemirror/lang-json'
 import { oneDark } from '@codemirror/theme-one-dark'
 import { Codemirror } from 'vue-codemirror'
 import { linter } from '@codemirror/lint'
-import { computed, ref } from 'vue'
+import { computed, ref, useAttrs } from 'vue'
 import { t } from '@/locales'
 const props = withDefaults(defineProps<{ modelValue?: any }>(), { modelValue: () => {} })
 const emit = defineEmits(['update:modelValue'])
@@ -124,6 +124,8 @@ const validate_rules = (rule: any, value: any, callback: any) => {
   return true
 }
 
+const editorAttrs = useAttrs() as any
+
 defineExpose({ validate_rules: validate_rules })
 </script>
 <style lang="scss">

ui/src/components/markdown/MdEditor.vue

@@ -1,20 +1,21 @@
 <template>
-  <MdEditor :language="language" noIconfont noPrettier v-bind="$attrs">
+  <MdEditor :language="language" noIconfont noPrettier v-bind="editorAttrs">
     <template #defFooters>
       <slot name="defFooters"> </slot>
     </template>
   </MdEditor>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, useAttrs } from 'vue'
 import { MdEditor, config } from 'md-editor-v3'
 import { getBrowserLang } from '@/locales/index'
 import './assets/markdown-iconfont.js'
 // 引入公共库中的语言配置
 import ZH_TW from '@vavt/cm-extension/dist/locale/zh-TW'
 
 defineOptions({ name: 'MdEditor' })
+const editorAttrs = useAttrs() as any
 const language = computed(() => localStorage.getItem('MaxKB-locale') || getBrowserLang() || '')
 config({
   editorConfig: {

ui/src/components/markdown/MdPreview.vue

@@ -1,16 +1,23 @@
 <template>
-  <MdPreview :language="language" noIconfont noPrettier :codeFoldable="false" v-bind="$attrs" />
+  <MdPreview
+    :language="language"
+    noIconfont
+    noPrettier
+    :codeFoldable="false"
+    v-bind="previewAttrs"
+  />
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, useAttrs } from 'vue'
 import { MdPreview, config } from 'md-editor-v3'
 import { getBrowserLang } from '@/locales/index'
 import useStore from '@/stores'
 // 引入公共库中的语言配置
 import ZH_TW from '@vavt/cm-extension/dist/locale/zh-TW'
 
 defineOptions({ name: 'MdPreview' })
+const previewAttrs = useAttrs() as any
 const { user } = useStore()
 const language = computed(() => user.getLanguage() || getBrowserLang() || '')
 config({