URLSearchParams가 빈 객체를 반환함

URLSearchParams가 빈 객체를 반환함

검색을 받고 싶다.params덧붙이다paramsURL로 이동하지만 매번 빈 배열을 가져오는 경우.

예제 URL -http://localhost:3000/buildings?search_query=test&page=2

constructor(props) {
  super(props);
  const params: URLSearchParams = new URLSearchParams(this.props.location.search);
  console.log(params); //Getting empty object {}
}

해보다

 console.log(params.get("page"));

'2'를 반환해야 한다.URLSearchParams는 콘솔에서 빈 객체로 표시되며 모든 값을 표시하지는 않는다.하지만 그것은 당신이 get 기능을 호출할 수 있게 해준다.

그렇지 않으면 이.props.location을 확인하십시오.검색은 유효한 기능을 가지고 있다.

new URL("http://localhost:3000/buildings?search_query=test&page=2").search

예를 들어 유효한 값을 반환한다.

react-router를 사용하고 URL 쿼리 문자열을 다음에 추가하십시오./buildings그래서.this.props.location.search비어 있다.

history.push({
  pathname: '/buildings?search_query=test&page=2',
});

URL 쿼리 문자열을 설정하십시오.search재산

history.push({
  pathname: '/buildings',
  search: '?search_query=test&page=2'
});

크롬 개발 콘솔에서 이 작업을 수행하면 여러 키를 가진 개체를 표시하는 표준 방식 대신 빈 개체를 콘솔로 반환함

params = new URLSearchParams(window.location.search)

파라미터를 로그아웃할 때 키가 있는 객체가 나타날 것으로 예상하지만 그렇지 않다.콘솔에서 그것들을 실제로 보기 위해서 당신은 반복해서 반복할 필요가 있다.

for (let item of params) {
  console.log('item: ', item)
}

보통 물건처럼 작동될 줄 알았더니 꽤 혼란스럽네

이렇게 하면 다음과 같은 매개 변수를 표시할 수 있다.

for (let param of params) {
  console.log(param);
}

이것은 모든 파라암을 콘솔에 보여줄 것이다.그리고 이 페이지에 있는 예들도 확인해봐, 도움이 될 것 같아!

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams

URLSearchParams할 수 있어, 너도 할 수 있어.[...params]일련의 키-값 쌍을 얻으십시오.

참조URL: https://stackoverflow.com/questions/63707870/urlsearchparams-returns-empty-object