inflearn logo
강의

Course

Instructor

Learning React A-Z by Following Along [Version 19 반영]

Implementing a search page using useLocation

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

624

ksr62457757

10 asked

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>
  )
}

Next.js redux typescript tdd react

Answer 4

1

ksr62457757

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

0

ksr62457757

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

0

ksr62457757

여기요!

0

John Ahn

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

강의 소스 코드 압축 풀기 오류

0

70

1

런타임 에러 ㅠㅠ

0

84

1

강의대로 따라갔는데 에러보다 api키로 들어간 넷플릭스? 그런게 렌더링 되지 않습니다 ㅠ

0

100

1

안녕하세요 개발과 상관없는 질문입니다만

0

111

1

리액트 라우터 관련

0

101

1

react-beatiful-dnd에서 문제가 발생합니다.

0

103

1

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

0

806

1

useEffect로 사용을 해도 되나요?

0

198

1

넷플릭스 오리지널 제외하고 슬라이드가 동작을 안합니다.

0

195

1

react 19의 useActionState가 더이상 isPending은 지원하지 않는 듯합니다

0

279

2

리액트 dockderfile 작성 시 COPY 질문

0

145

1

next.js에서부터는 react query 필요없는지

0

320

1

기능

0

193

1

오류가 안보여요

0

193

1

CSS

0

217

1

local storage

0

208

1

list컴포넌트 생성하기

0

223

1

검색어 입력 후 초기화하는 방법 궁금합니다!

0

331

1

Banner.css에 대해서

0

444

1

플러그인이 추천을 안해줍니다

0

320

1

마이너스버튼 테스트

0

279

2

리액트 서버 실행 오류

0

1156

2

오류메세지는 확인했는데 어떻게 고쳐야 할지 모르겠습니다 ㅠ

0

298

1

creactStore질문이요

1

284

2