Skip to content

Instantly share code, notes, and snippets.

@kwoncharles
Created February 24, 2019 07:28
Show Gist options
  • Save kwoncharles/6512b112aa8a0a5daadfca02b66a6f8d to your computer and use it in GitHub Desktop.
Save kwoncharles/6512b112aa8a0a5daadfca02b66a6f8d to your computer and use it in GitHub Desktop.
complete version of PopUpView
import React, { useState } from 'react';
import './PopUpView.css';
interface PopUpViewProps {
closePopUp: (selCheck: boolean) => void;
}
function PopUpView(props: PopUpViewProps) {
const [selCheck, setSelCheck] = useState<boolean>(false);
const onClosePopUp = (): void => {
props.closePopUp(selCheck);
}
const onCheck = (): void => {
setSelCheck(!selCheck);
}
return (
<div className="popup-wrapper">
<div className="popup-header">
<h2 className="popup-title">
Title
</h2>
</div>
<div className="popup-contents">
<article>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Non laudantium fugit ut explicabo odit suscipit laborum officia reiciendis repudiandae laboriosam? Vel corrupti sequi aut optio quidem, quisquam perspiciatis molestias esse!
</article>
</div>
<button onClick={onCheck}>
{selCheck
? 'Checked'
: '오늘 하루 열지 않기'
}
</button>
<button onClick={onClosePopUp}>
X
</button>
</div>
)
}
export default PopUpView;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment