diff --git a/src/Pages/ResultPage.tsx b/src/Pages/ResultPage.tsx index d15b6de..34b9e5b 100644 --- a/src/Pages/ResultPage.tsx +++ b/src/Pages/ResultPage.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useEffect, useState, useRef } from "react"; import { useLocation, useNavigate } from "react-router-dom"; import axios from "axios"; @@ -15,6 +15,15 @@ const ResultPage: React.FC = () => { const [error, setError] = useState(null); const navigate = useNavigate(); + const textRef = useRef(null); + + const checkOverflow = (element: HTMLElement | null) => { + if (element) { + return element.scrollWidth > element.clientWidth; + } + return false; + }; + useEffect(() => { if (!taskId) { setError("Task ID가 제공되지 않았습니다."); @@ -73,16 +82,18 @@ const ResultPage: React.FC = () => { className="overflow-hidden w-full min-h-screen flex flex-col items-center justify-center bg-cover bg-center" style={{ backgroundImage: 'url("Desktop - 9.svg")' }} > -
- -
-
- 추천 음악 목록 +
+
+
+ 추천 음악 목록 +
+ +
{searchResult.map((result, index) => ( @@ -104,15 +115,37 @@ const ResultPage: React.FC = () => { )}
-
-
+
+
{result.musicName}
-
-
+
+
{result.singer}