diff --git a/src/components/LaTeXEditor/index.vue b/src/components/LaTeXEditor/index.vue
index 7e128878..d5150758 100644
--- a/src/components/LaTeXEditor/index.vue
+++ b/src/components/LaTeXEditor/index.vue
@@ -39,7 +39,7 @@
           <div class="formula" v-else>
             <div class="formula-item" v-for="item in formulaList" :key="item.label">
               <div class="formula-title">{{item.label}}</div>
-              <div class="formula-item-content" @click="latex =item.latex">
+              <div class="formula-item-content" @click="latex = item.latex">
                 <FormulaContent
                   :width="236"
                   :height="60"
@@ -107,7 +107,7 @@ const symbolTabs = SYMBOL_LIST.map(item => ({
 
 const latex = ref('')
 const toolbarState = ref<'symbol' | 'formula'>('symbol')
-const textAreaRef = ref<HTMLTextAreaElement>()
+const textAreaRef = ref<InstanceType<typeof TextArea>>()
 
 const selectedSymbolKey = ref(SYMBOL_LIST[0].type)
 const symbolPool = computed(() => {
diff --git a/src/components/TextArea.vue b/src/components/TextArea.vue
index cab78abb..0d50897e 100644
--- a/src/components/TextArea.vue
+++ b/src/components/TextArea.vue
@@ -5,6 +5,7 @@
       'disabled': disabled,
       'resizable': resizable,
     }"
+    ref="textareaRef"
     :disabled="disabled"
     :value="value" 
     :rows="rows"
@@ -14,6 +15,8 @@
 </template>
 
 <script lang="ts" setup>
+import { ref } from 'vue'
+
 withDefaults(defineProps<{
   value: string
   rows?: number
@@ -34,6 +37,15 @@ const emit = defineEmits<{
 const handleInput = (e: Event) => {
   emit('update:value', (e.target as HTMLInputElement).value)
 }
+
+const textareaRef = ref<HTMLTextAreaElement>()
+const focus = () => {
+  if (textareaRef.value) textareaRef.value.focus()
+}
+
+defineExpose({
+  focus,
+})
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/Editor/EditorHeader/index.vue b/src/views/Editor/EditorHeader/index.vue
index 19968a19..daaf8e62 100644
--- a/src/views/Editor/EditorHeader/index.vue
+++ b/src/views/Editor/EditorHeader/index.vue
@@ -101,7 +101,7 @@ const { resetSlides } = useSlideHandler()
 const mainMenuVisible = ref(false)
 const hotkeyDrawerVisible = ref(false)
 const editingTitle = ref(false)
-const titleInputRef = ref<HTMLInputElement>()
+const titleInputRef = ref<InstanceType<typeof Input>>()
 const titleValue = ref('')
 
 const startEditTitle = () => {
diff --git a/src/views/Editor/SearchPanel.vue b/src/views/Editor/SearchPanel.vue
index a297277f..80b5a105 100644
--- a/src/views/Editor/SearchPanel.vue
+++ b/src/views/Editor/SearchPanel.vue
@@ -77,7 +77,7 @@ const close = () => {
   mainStore.setSearchPanelState(false)
 }
 
-const searchInpRef = ref<HTMLInputElement>()
+const searchInpRef = ref<InstanceType<typeof Input>>()
 onMounted(() => {
   searchInpRef.value!.focus()
 })