File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import React, { useRef } from "react";
import "./WordBundleBasicLearning.css";
const WordBundleBasicLearning = ({ contents }) => {
const audioRef = useRef(null);
// 이미지 클릭 시 오디오 재생
const playAudio = () => {
if (audioRef.current) {
audioRef.current.play();
}
};
if (!contents) {
return <div>Loading...</div>;
}
return (
<>
<img
src={contents.image}
alt="이미지"
className="wordBundle-basic-learning-img"
onClick={playAudio}
/>
<audio ref={audioRef} src={contents.file} />
<div className="wordBundle-basic-learning-word">
<h1>{contents.word}</h1>
<h3>{contents.wordMeaning}</h3>
</div>
</>
);
};
export default WordBundleBasicLearning;