From ccf83bf4c370fbfa7232aec9a97bbf60dfb5e272 Mon Sep 17 00:00:00 2001 From: Hyunjin <noh0605@ajou.ac.kr> Date: Wed, 2 Aug 2023 23:37:56 +0900 Subject: [PATCH] =?UTF-8?q?=EA=B5=90=EC=88=98=EB=8B=98=20=ED=94=BC?= =?UTF-8?q?=EB=93=9C=EB=B0=B1=20=EB=B0=98=EC=98=81=20ver1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 6 +++--- src/Favorites.js | 5 ++--- src/MusicList.js | 4 ++-- src/SnackMsg.js | 2 +- 4 files changed, 8 insertions(+), 9 deletions(-) diff --git a/src/App.js b/src/App.js index 2b0f243..e555769 100644 --- a/src/App.js +++ b/src/App.js @@ -18,10 +18,10 @@ export default function App () { //사이트 처음 들어갈 때 좋아요 목록이랑 좋아요 표시가 잘 나타나도록 useEffect(() => { fetch(`/likes`, {method:'GET'}) - .then((r) => Response.json()) + .then((r) => r.json()) .then((r) => {setFavorites(r), setLikes(r);}) .catch((error) => { - console.error("Error fetching favorites:", e); + console.error("Error fetching favorites:", error); }); }, []); @@ -33,7 +33,7 @@ export default function App () { setSnackState({open: true, msg: `${name} is clicked`}) if (likes[id]) {//이미 좋아요를 한 item이라면 - fetch(`/likes/${collectionId}`, {method: "DELETE"})//fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄 + fetch(`/likes/${id}`, {method: "DELETE"})//fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄 .then((r)=>r.json()) .then((r)=>{ console.log(r); diff --git a/src/Favorites.js b/src/Favorites.js index 8f789f3..914735d 100644 --- a/src/Favorites.js +++ b/src/Favorites.js @@ -11,11 +11,10 @@ import React from 'react'; import MusicList from './MusicList'; const Favorites = ({list, likes, toggleFavorite}) => { - - const favList = list.filter(item => likes[item.collectionId])//filter함수를 이용하여 좋아요 한 노래들만 필터링해서 favList에 집어넣기 + //이미 좋아요 리스트를 서버에서 넘겨받고 있기 때문에 favList 삭제 return ( - <MusicList list={favList} likes={likes} toggleFavorite={toggleFavorite}/> + <MusicList list={list} likes={likes} toggleFavorite={toggleFavorite}/> ); } diff --git a/src/MusicList.js b/src/MusicList.js index bbcac96..5c7b92e 100644 --- a/src/MusicList.js +++ b/src/MusicList.js @@ -25,10 +25,10 @@ export default function MusicList ({list, likes, toggleFavorite}) { <Card sx={styles.card} key={item.collectionId}> <CardContent> <Typography varient = "subtitle1"> {item.artistName} </Typography> - <Typography variant = "subtitle2"> {item.collectionCensoredName} </Typography> + <Typography variant = "subtitle2"> {item.collectionName} </Typography> </CardContent> <CardActions> - <IconButton onClick = {() => toggleFavorite(item.collectionId, item.collectionCensoredName)}> + <IconButton onClick = {() => toggleFavorite(item.collectionId, item.collectionName)}> {(likes[item.collectionId] === true) ? <Favorite/> : <FavoriteBorder/>} </IconButton> </CardActions> diff --git a/src/SnackMsg.js b/src/SnackMsg.js index e3766f2..411c5e4 100644 --- a/src/SnackMsg.js +++ b/src/SnackMsg.js @@ -6,7 +6,7 @@ const SnackMsg = (props) => { return ( <Snackbar open = {props.open} - anchorOrigin = {{vertical: 'Bottom', horizontal: 'right'}} + anchorOrigin = {{vertical: 'bottom', horizontal: 'right'}} autoHideDuration = {3000} onClose = {props.onClose} message = {props.message}> -- GitLab