전체 > 리액트 (2) 리액트 06: 사용자 정의 이벤트 구현 안녕하세요, 각성한 데브키라입니다. 웹 개발을 하다 보면 사용자의 행동에 따라 다양한 이벤트를 처리해야 할 필요가 있습니다. 오늘은 리액트에서 사용자의 클릭 이벤트를 다루는 방법과, 이벤트에 필요한 데이터를 전달하는 방식에 대해 알아보겠습니다. [ 핵심 내용정리 ][ 주요 부분만 스크랩한 코드입니다. ]====== 변수선언 ====== const topics = [ {id:1, title:"게시글1", content:"컨텐츠1..."}, {id:2, title:"게시글2", content:"컨텐츠2..."}, ] ====== 컴포넌트를 호출 ====== { ====== 컴포넌트에서 이벤트가 발생 후 이벤트 데이터를 전달받음 ====== ...내용 .. 리액트 05: 리스트데이터의 활용 topics변수 사용 안녕하세요, 각성한 데브키라입니다. 오늘은 React에서 'topics' 변수를 활용해 데이터를 효과적으로 관리하는 방법을 알아봅니다. 이를 통해 동적 데이터를 사용자에게 보다 효율적으로 제공하는 방법을 살펴보겠습니다.[ 핵심 내용정리 ] 배열형태의 토픽변수를 Prop형태로 전송함으로써 동적으로 데이터를 가공할 수 있습니다.토픽형태의 변숫값을 사용할 때는 key값을 할당해서 사용해야 합니다.props 변수 사용 시 http://abc.com/'+props.path}"> 링크 이런 식으로 조합해서 사용할 수 있습니다.1. topics형태의 변수 하드코딩 주입토픽변수를 Nav컴포넌트에서 직접적으로 주입해서 출력하는 예제입니다.import './App.css';function Nav(){ const li.. 이전 1 다음
