Ma/LunaTV
1
0
Fork 0
mirror of https://github.com/MoonTechLab/LunaTV.git synced 2026-05-14 00:39:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(search): 移除未使用的useRef并改用getElementById聚焦

Browse Source 
移除searchInputRef的useRef引用，改用document.getElementById直接获取DOM元素进行聚焦操作，简化代码结构
This commit is contained in:
SongPro
2025-07-03 20:54:23 +08:00
parent ed3e5f5a28
commit 46bc187a9d
1 changed files with 3 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/app/search/page.tsx
View File

@@ -3,7 +3,7 @@
import { Search, X } from 'lucide-react'; import { Search, X } from 'lucide-react';
import { useRouter, useSearchParams } from 'next/navigation'; import { useRouter, useSearchParams } from 'next/navigation';
import { Suspense, useEffect, useMemo, useRef, useState } from 'react'; import { Suspense, useEffect, useMemo, useState } from 'react';
import { import {
addSearchHistory, addSearchHistory,
@@ -27,7 +27,6 @@ function SearchPageClient() {
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [showResults, setShowResults] = useState(false); const [showResults, setShowResults] = useState(false);
const [searchResults, setSearchResults] = useState<SearchResult[]>([]); const [searchResults, setSearchResults] = useState<SearchResult[]>([]);
const searchInputRef = useRef<HTMLInputElement>(null);
// 视图模式：聚合(agg) 或 全部(all)，默认值由环境变量 NEXT_PUBLIC_AGGREGATE_SEARCH_RESULT 决定 // 视图模式：聚合(agg) 或 全部(all)，默认值由环境变量 NEXT_PUBLIC_AGGREGATE_SEARCH_RESULT 决定
const [viewMode, setViewMode] = useState<'agg' | 'all'>( const [viewMode, setViewMode] = useState<'agg' | 'all'>(
@@ -52,7 +51,7 @@ function SearchPageClient() {
useEffect(() => { useEffect(() => {
// 无搜索参数时聚焦搜索框 // 无搜索参数时聚焦搜索框
!searchParams.get('q') && searchInputRef.current?.focus(); !searchParams.get('q') && document.getElementById('searchInput')?.focus();
getSearchHistory().then(setSearchHistory); getSearchHistory().then(setSearchHistory);
}, []); }, []);
@@ -116,7 +115,7 @@ function SearchPageClient() {
<div className='relative'> <div className='relative'>
<Search className='absolute left-3 top-1/2 h-5 w-5 -translate-y-1/2 text-gray-400 dark:text-gray-500' /> <Search className='absolute left-3 top-1/2 h-5 w-5 -translate-y-1/2 text-gray-400 dark:text-gray-500' />
<input <input
ref={searchInputRef} id='searchInput'
type='text' type='text'
value={searchQuery} value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)} onChange={(e) => setSearchQuery(e.target.value)}