优化弹幕加载提示

src/components/DanmakuFilterSettings.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 'use client';
 
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { X, Plus, Trash2, ToggleLeft, ToggleRight } from 'lucide-react';
 import { DanmakuFilterConfig, DanmakuFilterRule } from '@/lib/types';
 import { getDanmakuFilterConfig, saveDanmakuFilterConfig } from '@/lib/db.client';
@@ -26,6 +26,8 @@ export default function DanmakuFilterSettings({
   const [saving, setSaving] = useState(false);
   const [isVisible, setIsVisible] = useState(false);
   const [isAnimating, setIsAnimating] = useState(false);
+  const [inputKey, setInputKey] = useState(0); // 用于强制重新渲染输入框
+  const inputRef = useRef<HTMLInputElement>(null); // 用于直接操作输入框 DOM
 
   // 控制动画状态
   useEffect(() => {
@@ -176,7 +178,17 @@ export default function DanmakuFilterSettings({
       rules: [...prev.rules, newRule],
     }));
 
+    // 清空输入框并强制重新渲染
     setNewKeyword('');
+
+    // 使用 setTimeout 确保在状态更新后操作 DOM
+    setTimeout(() => {
+      if (inputRef.current) {
+        inputRef.current.value = ''; // 直接清空 DOM 值
+        inputRef.current.blur(); // 失去焦点，阻止自动填充
+      }
+      setInputKey(prev => prev + 1); // 强制重新渲染输入框
+    }, 0);
   };
 
   // 删除规则
@@ -279,11 +291,19 @@ export default function DanmakuFilterSettings({
             </h3>
             <div className="space-y-3">
               <input
+                key={inputKey}
+                ref={inputRef}
                 type="text"
                 value={newKeyword}
                 onChange={(e) => setNewKeyword(e.target.value)}
                 onKeyPress={(e) => e.key === 'Enter' && handleAddRule()}
                 placeholder="输入要屏蔽的关键字"
+                autoComplete="off"
+                autoCorrect="off"
+                autoCapitalize="off"
+                spellCheck="false"
+                data-form-type="other"
+                data-lpignore="true"
                 className="w-full px-4 py-3 bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 rounded-lg border border-gray-200 dark:border-gray-600 focus:border-teal-500 focus:outline-none focus:ring-2 focus:ring-teal-500/20 transition-all duration-200"
               />
               <div className="flex gap-2">

src/components/DanmakuPanel.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { MagnifyingGlassIcon } from '@heroicons/react/24/outline';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import { getEpisodes, searchAnime } from '@/lib/danmaku/api';
 import type {
@@ -30,6 +30,7 @@ export default function DanmakuPanel({
   const [isSearching, setIsSearching] = useState(false);
   const [isLoadingEpisodes, setIsLoadingEpisodes] = useState(false);
   const [searchError, setSearchError] = useState<string | null>(null);
+  const initializedRef = useRef(false); // 标记是否已初始化过
 
   // 搜索弹幕
   const handleSearch = useCallback(async (keyword: string) => {
@@ -116,12 +117,13 @@ export default function DanmakuPanel({
     [currentSelection]
   );
 
-  // 当视频标题变化时，更新搜索关键词
+  // 当视频标题首次加载时，初始化搜索关键词（仅执行一次）
   useEffect(() => {
-    if (videoTitle && !searchKeyword) {
+    if (videoTitle && !initializedRef.current) {
       setSearchKeyword(videoTitle);
+      initializedRef.current = true; // 标记已初始化，防止后续自动填充
     }
-  }, [videoTitle, searchKeyword]);
+  }, [videoTitle]);
 
   return (
     <div className='flex h-full flex-col overflow-hidden'>
@@ -138,6 +140,12 @@ export default function DanmakuPanel({
               }
             }}
             placeholder='输入动漫名称搜索弹幕...'
+            autoComplete='off'
+            autoCorrect='off'
+            autoCapitalize='off'
+            spellCheck='false'
+            data-form-type='other'
+            data-lpignore='true'
             className='flex-1 rounded-lg border border-gray-300 px-3 py-2 text-sm
                      transition-colors focus:border-green-500 focus:outline-none
                      focus:ring-2 focus:ring-green-500/20