feat: togglePlay 方法取消使用 useCallback

This commit is contained in:
HouKunLin 2023-05-17 09:27:16 +08:00
parent 4b67542799
commit 33a6abab7f
1 changed files with 3 additions and 4 deletions

View File

@ -18,7 +18,6 @@ import {
import { DecryptedAudioFile, deleteFile, ProcessState } from './fileListingSlice'; import { DecryptedAudioFile, deleteFile, ProcessState } from './fileListingSlice';
import { useCallback, useRef } from 'react'; import { useCallback, useRef } from 'react';
import { useAppDispatch } from '~/hooks'; import { useAppDispatch } from '~/hooks';
import coverFallback from '~/assets/no-cover.svg';
interface FileRowProps { interface FileRowProps {
id: string; id: string;
@ -35,7 +34,7 @@ export function FileRow({ id, file }: FileRowProps) {
const decryptedName = nameWithoutExt + '.' + file.ext; const decryptedName = nameWithoutExt + '.' + file.ext;
const audioPlayerRef = useRef<HTMLAudioElement>(null); const audioPlayerRef = useRef<HTMLAudioElement>(null);
const togglePlay = useCallback(() => { const togglePlay = () => {
const player = audioPlayerRef.current; const player = audioPlayerRef.current;
if (!player) { if (!player) {
return; return;
@ -46,7 +45,7 @@ export function FileRow({ id, file }: FileRowProps) {
} else { } else {
player.pause(); player.pause();
} }
}, []); };
const handleDeleteRow = useCallback(() => { const handleDeleteRow = useCallback(() => {
onClose(); onClose();
@ -89,7 +88,7 @@ export function FileRow({ id, file }: FileRowProps) {
objectFit="cover" objectFit="cover"
src={metadata.cover} src={metadata.cover}
alt={`"${metadata.album}" 的专辑封面`} alt={`"${metadata.album}" 的专辑封面`}
fallbackSrc={coverFallback} fallbackSrc={'/assets/no-cover.svg'}
/> />
)} )}
</Center> </Center>