JS window.close 이후 부모창 새로고침하는 방법, 창 닫은 후 새로고침

opener.location.reload()

opener.parent.location.reload()

 

opener 개체는 현재 창을 열었던 창에 대한 참조를 저장합니다. opener 개체가 정의되어 있으면 opener 개체를 사용하여 현재 창을 열었던 창의 속성과 메서드에 액세스 할 수 있습니다.
opener.location.reload() 메서드는 현재 창을 열었던 창의 URL을 새로 고칩니다. 즉, 현재 창을 열었던 창의 페이지가 다시 로드됩니다.
opener.parent.location.reload() 메서드는 현재 창의 부모 창의 URL을 새로 고칩니다. 즉, 현재 창의 부모 창의 페이지가 다시 로드됩니다.
예를 들어 새 창을 열고 새 창에서 작업을 수행한 다음 새 창을 닫고 부모 창을 새로 고치려면 다음 코드를 사용할 수 있습니다.

 

예시

const App = () => {
  const [isOpen, setIsOpen] = useState(false);

  const openNewWindow = () => {
    setIsOpen(true);

    // 새 창을 엽니다.
    const newWindow = window.open("https://www.google.com");

    // 새 창에서 작업을 수행합니다.
    newWindow.document.querySelector("body").innerHTML = "Hello World!";

    // 새 창을 닫습니다.
    newWindow.close();

    // 부모 창을 새로 고칩니다.
    window.parent.location.reload();
  };

  return (
    <div>
      {isOpen ? (
        <p>새 창이 열려 있습니다.</p>
      ) : (
        <button onClick={openNewWindow}>새 창 열기</button>
      )}
    </div>
  );
};

opener.location.reload()과 opener.parent.location.reload()의 차이

opener.location.reload()과 opener.parent.location.reload()의 차이는 opener의 값이 무엇이냐에 따라 달라집니다.

opener가 undefined이면 opener.location.reload()은 아무런 동작을 하지 않습니다.
opener가 window이면 opener.location.reload()은 현재 창을 새로 고칩니다.
opener가 다른 창이면 opener.location.reload()은 그 창을 새로 고칩니다.
opener.parent.location.reload()은 항상 현재 창의 부모 창을 새로 고칩니다.