URL 쿼리 매개변수는 매개변수가 설정된 경우에도 null을 반환합니다.

반응 라우터와 동적 URL이 있는 반응 앱이 있습니다. 그리고 나는 또한 2개의 GET 매개변수가 /?name=something&date=2021있고 이름 매개변수가 date어떤 이유로 잘 작동하는 동안 항상 null을 반환합니다. onSubmit을 사용하여 양식에 매개변수를 설정합니다.

function submitAction(e) {
  e.preventDefault();
  props.onChange(search, selectedDate);
  const currUrl = new URL(window.location.href);
  currUrl.searchParams.set("date", format(selectedDate, "yyyy"));
  currUrl.searchParams.set("name", search);
  window.history.pushState({}, "", currUrl);
  setSearch("");
}

useEffect()반응 후크를 사용 하여 매개변수 가져오기

  useEffect(() => {
const params = new URLSearchParams(window.location.href);
const date = params.get("date");
const name = params.get("name");
console.log(name);
console.log(date);  //this always returns null
if (name) {
  setFilter(name);
}
if (date) {
  setDate(new Date(date));
}}, []);

따라서 내 쿼리 문자열이 변경되고 작동하지만 두 번째 URL 매개 변수가 작동하지 않습니다. 쿼리 문자열은 다음과 같습니다. http%3A%2F%2Flocalhost%3A3000%2F%3Fdate=2018&name=