• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

netflix searchPage인데 검색할때 한글자만 검색해도 흰색 바탕이 나와버려요

22.12.15 09:09 작성 조회수 361

0

import axios from '../../api/axios';
import React,{useEffect,useState} from 'react'
import { useLocation } from 'react-router-dom';

export default function SearchPage() {
  
  console.log('useLocation()', useLocation());

  const [searchResults, setSearchResults] = useState([]);

  let query = useQuery();
  const searchTerm = query.get("q");
  console.log('searchTerm: ', searchTerm);

  useEffect(() => {
    if(searchTerm) {
      fetchSearchMovie(searchTerm);
    }
  }, [searchTerm]);

  const fetchSearchMovie = async (searchTerm) => {
    try{
      const request = await axios.get(
        `/search/multi?include_adult=false&query=${searchTerm}`
      )
      console.log(request);
      setSearchResults(request.data.results);
    }catch(error){
      console.log("error : ", error);
    }
  };

  const useQuery = () => {
    return new URLSearchParams(useLocation().search);
  }

  return (
    <div>SearchPage</div>
  )
}

답변 4

·

답변을 작성해보세요.

1

김사랑님의 프로필

김사랑

질문자

2022.12.16

추가적으로 한번 입력한 거 에서 수정이 안되요 에러는 안나구 아예 입력창에 마우스가 안먹어요

0

김사랑님의 프로필

김사랑

질문자

2022.12.16

아쌤! const useQuery의 위치를 맨 밑으로 해놨더니 그런거였나봐용 const useQuery가 먼저 선언되고 let query가 선언되어야 했는데 그래서 에러가 났나보군요!? 첨언해주실 것 있으면 부탁드릴게용

0

김사랑님의 프로필

김사랑

질문자

2022.12.16

여기요!

0

안녕하세요.
혹시 에러가 어떤 게 나오는지도 알 수 있을까요?!
그 에러 로그에요 ~