[React] toggle 메뉴 (useState)

sona·2022년 9월 9일
0

🚀 React

목록 보기
9/20
const Posting = () => {
  	//false:첫 화면은 닫혀있는 상태
  	const [calendarOpen, setCalendarOpen] = useState(false);
  	//boolean값 주기
	const calendarClose = () => {
		setCalendarOpen(!calendarOpen);
	};

<div className="posting_calendar_wrap">
	<div className="posting_calendar_icon">
		<HiOutlineCalendar
			style={{ marginRight: '14px' }}
			color="#757575"
			size="24px"
			onClick={calendarClose}
		/>
		{calendarOpen && <Calendar calendarClose={calendarClose}></Calendar>}
		<div className="posting_calendar">
			<Calendar
				style={{ marginRight: '14px' }}
				color="#212121"
				size="24px"
				display="none"
			/>
		</div>
	</div>
</div>;
};

export default Posting;

0개의 댓글