소품 대 상태
소품 대 상태
Props::는 한 구성 요소에서 다른 구성 요소로 데이터를 전달하는 데 사용되며
State::는 구성 요소에만 국한되며 다른 구성 요소에 전달할 수 없는 로컬 데이터 저장소입니다.
(즉)
소품
("속성"의 줄임말)은 읽기 전용입니다. 반응 구성 요소에 대한 첫 번째 인수로 허용되는 반응 구성 요소의 임의 입력.
React is a component-based library
which divides the UI into little reusable pieces. In some cases known as component's, those components need to communicate (send data to each other) and the way to pass data between components is by using props.
for example
when u want to pass or (send) some data to a child component from the parent component then your child component access that data as props
the data can be anything from
functions,variables,strings,arrys.....
- But the important part here is that data with props is passed in a uni-directional flow. (one way from parent to child)
Furthermore, props data is read-only, which means that data coming from the parent should not be changed by child components.
class ParentComponent extends Component {
render() {
return (
<ChildComponent name="First Child" />
);
}
}
const ChildComponent = (props) => {
return <p>{props.name}</p>;
};
먼저 상위 구성 요소에서 일부 데이터를 정의/가져와서 하위 구성 요소의 "prop"속성에 할당해야 합니다.
<ChildComponent name="First Child" />
"이름"은 여기에 정의된 소품이며 텍스트 데이터를 포함합니다. 그런 다음 함수에 인수를 제공하는 것처럼 props를 사용하여 데이터를 전달할 수 있습니다.
const ChildComponent = (props) => {
// statements
};
마지막으로 점 표기법을 사용하여 소품 데이터에 액세스하고 렌더링합니다.
return <p>{props.name}</p>;
주의해야 할 몇 가지 사항
- Props는 구성 요소에 대한 입력 값입니다.
-Props는 상위 구성 요소에서 하위 구성 요소로 전달되는 데이터입니다. 자식 구성 요소는 다시 부모 구성 요소에 소품을 보낼 수 없습니다.
- Props는 순수하게 유지되어야 하는 읽기 전용 구성 요소입니다. 즉, Props는 변경할 수 없습니다.
- 사용자 지정 데이터를 구성 요소에 전달하고 상태 변경을 트리거합니다.
- Prop은 데이터를 한 구성 요소에서 다른 구성 요소로 전달하는 가장 좋은 방법입니다.
Props는 react에서 임의의 입력으로 사용되는 속성일 뿐입니다. 이는 한 구성 요소에서 선언하지만 다른 구성 요소에서 사용하려는 모든 임의 입력과 같습니다. 예를 들어 컴포넌트 A에서 함수를 선언했지만 컴포넌트 B와 C에서 사용하고 싶다면 함수를 props로 저장하고 그것을 참조하여 다른 컴포넌트 내부에서 호출합니다. 그렇지 않으면 두 번째 구성 요소에서 사용하려는 함수를 직접 선언하고 해당 구성 요소 내부에서 사용할 수 있습니다.
도움이 되셨기를 바랍니다.
다음 부분은 행복한 코딩 시작으로 끝납니다.
Reference
이 문제에 관하여(소품 대 상태), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/kizadekmupela/props-vs-state-25fc텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)