React] 플래그 변수

리액트에서 플래그 변수는 특정 상태나 조건을 true/false 형태로 관리하는 변수입니다.

주로 특정 기능을 활성화하거나 표시 상태를 관리할 때 사용됩니다.

플래그 변수는 일반적으로 boolean 값을 가지며,

사용자 인터페이스(UI)에서 특정 컴포넌트의 보임/숨김 또는 활성화/비활성화 상태를 조정하거나,

로딩 상태를 나타내는 데 자주 사용됩니다.

import React, { useState } from "react";

function App() {

const [isModalOpen, setIsModalOpen] = useState(false);

const toggleModal = () => {
  setIsModalOpen((prev) => !prev); // 이전 상태와 반대로 변경
};

return (
  <div>
    <button onClick={toggleModal}>
      {isModalOpen ? "Close Modal" : "Open Modal"}
    </button>
    
    {isModalOpen && <div className="modal">This is a modal window.</div>}
  </div>
);
}

export default App;

리액트에서 플래그 변수는 특정 상태나 조건을 true/false 형태로 관리하는 변수입니다. 주로 특정 기능을 활성화하거나 표시 상태를 관리할 때 사용됩니다. 플래그 변수는 일반적으로 boolean 값을 가지며, 사용자 인터페이스(UI)에서 특정 컴포넌트의 보임/숨김 또는 활성화/비활성화 상태를 조정하거나, 로딩 상태를 나타내는 데 자주 사용됩니다.