React의 컴포넌트 데이터

컴포넌트 데이터는 세 곳에 저장될 수 있습니다: props, 컴포넌트의 변수와 상수, 그리고 state. Props는 부모 컴포넌트가 외부에서 컴포넌트로 보내는 데이터를 저장합니다. 이때 컴포넌트 내부에서는 props가 불변해야 합니다.

변수, 상수, 그리고 state에는 컴포넌트 자체에 중요하고 부모가 알 필요가 없는 로컬 데이터를 저장해야 합니다. 이때 state에는 다양한 이벤트에서 변경될 수 있고, 해당 변경사항이 반응형이 되기를 원하는 데이터를 저장해야 합니다.

다음 컴포넌트가 주어졌습니다:

function Test() {
	// isEdit, elem, data의 정의
	
	if (isEdit) {
		elem = <input value={data} />;
	} else {
		elem = <span>{data}</span>;
	}
	
	return <div>
		{elem}
	</div>;
}

isEdit, elem, 그리고 data가 무엇일 수 있는지 결정하세요: prop, state, 변수, 또는 상수.