본문 바로가기

전체 글

 (41)
리액트 react create 예제 function Article(props) { return {props.title} {props.body} } function Header(props) { return { event.preventDefault(); // 기본 동작 방지 props.onChangeMod(); }}>{props.title} } function Nav(props) { const lis = []; for(let i = 0; i {t.title} ); } return {lis} } function Create(props) { return Create { event.preventDefault(); const title = event.target.title.value; const body = event.target.body.va..
리액트 react state prop 과 state의 공통점은 각각의 값이 변경되면 새로운 return 값을 만들어 ui를 바꿈 차이점은 prop은 컴포넌트를 사용하는 외부자를 위한것 state는 컴포넌트를 만드는 내부자를 위한것 function App() { const mode = 'WELCOME'; const topics = [ {id:1, title:'html', body:'html is ...'}, {id:2, title:'css', body:'css is ...'}, {id:3, title:'javascript', body:'javascript is ...'} ] let content = null; if(mode === 'WELCOME') { content = }else if (mode === 'READ') { conten..
리액트 react 이벤트(event) function Header(props) { return {props.title} } 결과 축약형 어로우 펑션 { alert('Header'); }}> function Header(props) { return { event.preventDefault(); // 기본 동작 방지 props.onChangeMod(); }}>{props.title} } 태그가 복수일때 const topics = [ {id:1, title:'html', body:'html is ...'}, {id:2, title:'css', body:'css is ...'}, {id:3, title:'javascript', body:'javascript is ...'} ] { alert(id); }}> function Nav(props) { c..

티스토리툴바