전체 글 (125) 함수형 컴포넌트의 생명주기 분류 클래스형 컴포넌트 함수형 컴포넌트 Mounting constructor() 함수형 컴포넌트 내부 Mounting render() return() Mounting ComponenDidMount() useEffect() Updating componentDidUpdate() useEffect() UnMounting componentWillUnmount() useEffect() useEffect useEffect(() => { //코드 }) : 모든 컴포넌트가 리렌더링 될 때마다 실행 componentDidMount() useEffect(() => { //코드 },[]) : 한번만 실행 componentDidUpdate() & getDerivedStateFromProps() useEffect(() => {.. 5. Create import {useState} from 'react'; //훅 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function Create(props) { return Create { event.preventDefault(); const title = event.target.title.value; const body = e.. 4. useState import {useState} from 'react'; //훅 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function App() { /* const _mode = useState{'WELCOME'}; //초기값 const mode = _mode[0]; //상태값 const setMode = _mode[1]; //값.. 3. 이벤트 props 를 이용하여 onClick, onChangeMode 등 이벤트를 적용하기 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function App() { const topics = [ {id:1, title:'html', body:'html is ...'}, {id:2, title:'css', body:'css is.. 2. props (속성) props(속성)을 html 태그 안에서 사용하려면 { } 안에 props를 넣어준다. function Header(props) { return {props.title} } function Nav() { return html css javascript } function Article(props) { return {props.title} {props.body} } function App() { return ( ); } export default App; props 를 이용하여 동적태그 생성하기 function Header(props) { return {props.title} } function Nav(props) { const lis = []; for(let i=0; i 이전 1 2 3 4 ··· 25 다음