>웹 프론트엔드 >JS 튜토리얼 >반응 수명주기 기능은 무엇입니까?

반응 수명주기 기능은 무엇입니까?

hzc
hzc원래의
2020-06-22 15:31:032801검색

반응 수명주기 기능은 무엇입니까?

react 수명 주기 기능

Initialization

1.getDefaultProps()

참고: getDefaultProps는 React.createClass 메서드를 사용하여 구성 요소를 정의할 때 사용됩니다.
es6 Grammar를 사용하는 경우, 예를 들어 클래스 구성 요소 이름을 사용하여 React.Component를 정의하고
getDefaultProps를 사용하여 props를 정의하지 마세요. 대신 static propTypes = {}를 사용하여 정의해야 합니다. 그러면 경보가 발생하지 않습니다.

设置默认的props,也可以用dufaultProps设置组件的默认属性. ---》设置
2.getInitialState()

참고: getDefaultProps와의 차이점은 전자가 기본 props를 설정하는 반면 후자는 초기 상태를 설정한다는 것입니다. es6 클래스 구문을 사용할 때 생성자에서 직접 this.state를 정의할 수 없습니다. 이때 this.props에 액세스할 수 있습니다.

3.comComponentWillMount

참고: 구성 요소가 초기화될 때만 호출됩니다. 전체 수명 주기에서 한 번만 호출됩니다. 이때 상태를 수정할 수 있습니다.

4.render()

참고: 가장 중요한 반응 단계, 가상 DOM 생성, diff 알고리즘 수행 및 DOM 트리 업데이트가 모두 여기에서 수행됩니다. 이 시점에서는 상태를 변경할 수 없습니다.

5.comComponentDidMount()

참고: 구성 요소가 렌더링된 후 호출되며 한 번만 호출됩니다. 여기에서 데이터를 요청할 수 있습니다

·Update

1.comComponentWillReceiveProps(nextProps)

참고: 구성 요소가 초기화될 때는 호출되지 않지만 구성 요소가 새 prop을 수락할 때 호출됩니다.

2.shouldComponentUpdate(nextProps, nextState)

참고: React 성능 최적화는 매우 중요한 부분입니다. 구성 요소가 새 상태 또는 소품을 허용할 때 호출됩니다. 비교 전과 후의 두 prop과 상태가 동일한지 여부를 설정할 수 있습니다. 동일한 속성 상태는 확실히 동일하므로 업데이트를 방지하기 위해 false를 반환합니다. DOM 트리이므로 필요가 없습니다. 새로운 DOM 트리를 생성하고 이전 DOM 트리를 diff 알고리즘과 비교하면 특히 DOM 구조가 복잡할 때 많은 성능을 절약할 수 있습니다.

3.comComponentWillUpdata(nextProps, nextState)

참고 : 컴포넌트가 초기화될 때만 호출됩니다. 업데이트될 때만 호출됩니다.

4.render()

참고: 컴포넌트. render

5.comComponentDidUpdate()

참고: 컴포넌트가 초기화될 때는 호출되지 않습니다. 이때 컴포넌트 업데이트가 완료된 후에 호출됩니다.

·Uninstall

comComponentWillUnmount()
참고: 구성 요소가 마운트 해제되려고 할 때 호출되며 이때 일부 이벤트 리스너와 타이머를 지워야 합니다.

추천 튜토리얼: "react 튜토리얼"

위 내용은 반응 수명주기 기능은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.