728x90 300x250 티스토리챌린지6 props에 컴퍼넌트 사용하기 {} 중괄호를 사용해서 props 값으로 컴포넌트를 넣을 수도 있다.// ChildComponent.jsimport React from 'react';const ChildComponent = ({ message }) => { return {message};};export default ChildComponent; message라는 prop를 받아서 그 값을 화면에 표시한다.// ParentComponent.jsimport React from 'react';import ChildComponent from './ChildComponent';const ParentComponent = () => { const customMessage = "안녕하세요, 자식 컴포넌트입니다!"; return ( .. 2024. 11. 10. props에 {} 중괄호 사용하는 이유와 방법 중괄호를 사용하면 무조건 자바스크립트 코드가 들어간다. // 자식 컴포넌트 Greeting 정의function Greeting(props) { return ( 안녕하세요, {props.name}님! 당신의 나이는 {props.age}세입니다. {props.message} );}// 부모 컴포넌트에서 Greeting 사용function App() { return ( );} 위와 같이 숫자에 중괄호를 안쓰면 문자열로 이해한다. 문자열 이외에 정수, 변수, 또는 다른 컴포넌트가 들어갈 경우에는 {} 중괄호로 감싸줘야 한다. 중괄호 없는 경우 // 정적 문자열 중괄호 있는 경우const userName = "홍길동"; // 동적 변수 따라.. 2024. 11. 9. 이전 1 2 다음 728x90 반응형