jsx (2) 썸네일형 리스트형 [Fast Campus , React] 12. TicTacToe 앱 만들기 (6) JSX key , jumpTo함수 JSX key 속성 리액트에서 요소의 리스트를 나열할때는 key를 넣어야한다. React가 변경,추가,제거된 항목 식별하는데 도움이 된다. 요소에 안정적인 ID를 부여하려면 배열 내부의 요소에 키를 제공해야 한다. 리액트는 가상돔을 이용해서 바뀐 부분만 실제 돔에 적용 key를 이용해서 어떠한 부분이 바뀌었는지 인식할 수 있다. key에는 유니크한 값을 넣어준다. (index는 비추천) 만약 리스트가 추가되거나 제거되면 해당 리스트의 key값도 바뀔수 있기 JumpTo 함수 작성 현재 몇 번째 스텝이지 알수있는 state 생성하기. 이전으로 되돌아갔을때 그 step을 기억하기 위해 const [stepNumber, setStepNumber] = useState(0); stepNumber를 업데이트위해 j.. Coding Apple, React 강좌 내용 정리.2- JSX 기본 문법 JSX? src / App.js의 내용을 확인하자 기본적인 javascript 함수가 나오는데 return 함수 내부는 일상적인 html 코드처럼 작성을 하되 특정 문법에 맞춰서 코딩을 한다 이 부분이 JSX. html 의 class를 쓸 수가 없고, className을 사용한다 스타일링 (css ) - import 된 App.css 파일에서 관리를 하게 된다 실제 표시될 부분과 css (스타일링)은 별도로 구분해서 코딩한다. 확인하기 : black-nav라는 이름으로 새로운 div를 만들고, 그에 따른 스타일링을 App.css에 추가한다. 일단 평상시 쓰던 html / css처럼 만든다고 생각하자. 데이터 바인딩 : 왜 리액트를 쓰고, Vuew를 쓰고 하는지에 대한 이유 * 데이터를 html에 표시하는.. 이전 1 다음
