reactive-native-draggaggable-flatlist 끌어서 놓기(flatlist) whichComponentUpdate와 함께 사용할 경우 재설정
목록 중 하나에 reactive-native-dragggaggable-flatlist를 사용하는 react-native 응용 프로그램에서 작업 중인데 불행히도 다른 구성 요소의 다른 목록 항목에서 데이터 조작을 위해 구성 요소에서 shouldComponentUpdate를 사용해야 하지만 wasComponentUpdate를 추가한 후 드래그/drop이 작동하지 않아 끌 수 있고 DR할 수 있음op 그러나 그것은 즉시 전체 목록을 원래의 위치설정 세트로 리셋한다.
기존 기능을 해제하지 않으려면 끌어서 놓기와 함께 should/drop을 사용할 수 있는 몇 가지 제안을 도와주십시오.
코드
<DraggableFlatList
scrollPercent={5}
data={testData}
renderItem={this.renderItem}
keyExtractor={item => `item-${testkey}`}
onMoveEnd={({ data }) => {
this.setState({ data });
}}
/>
public shouldComponentUpdate(nextProps, nextState) {
if (nextProps.data.length !== nextState.data.length) {
this.setState({
data: nextProps.data
})
}
return true
}
shouldComponentUpdate
sideEffects를 위해 의도된 것은 아니다.성능 편익을 위한 받침 변경에 대한 환원기 렌더 카운트에 사용된다.whichComponentUpdate는 구성 요소를 리렌더할지 여부를 결정하는 true 또는 false를 반환해야 한다.
사용해도 좋다componentDidUpdate
소품 변경 후 발생하는 화재는componentWillReceiveProps
소품보다 먼저 발생한 화재는
사용하는 것을 추천한다.componentDidUpdate
맘에 들다
componentDidUpdate = (prevProps, prevState) => {
if (this.props.data.length !== this.state.data.length) {
this.setState({
data: nextProps.data
})
}
}
너는 사용해서는 안 된다.shouldComponentUpdate
이런 목적으로, 이것 때문에그냥 베끼는 거라면props.data
로state.data
, 왜 그냥 사용하지 않는가?props.data
직접?
모든 업데이트에 복사를 수행해야 하는 경우 다음과 같은 다른 라이프사이클 방법을 사용하십시오.componentDidUpdate
또는getDerivedStateFromProps
당신은 또한 사용할 수 있다.componentWillReceiveProps
그러나 그것은 더 이상 사용되지 않고 있으므로 피해야 한다.
'Programing' 카테고리의 다른 글
Python 3으로 pip을 설치하는 방법? (0) | 2022.03.19 |
---|---|
Python 수퍼()가 TypeError를 발생시킴 (0) | 2022.03.19 |
관찰 가능>에서 특정 요소를 제거하는 방법 (0) | 2022.03.19 |
다른 항목을 클릭하여 요소의 클래스를 추가 및 제거하는 방법리액트-리플렉스로 (0) | 2022.03.19 |
다중 페이지 앱에서 반응 사용 (0) | 2022.03.19 |