Programing

reactive-native-draggaggable-flatlist 끌어서 놓기(flatlist) whichComponentUpdate와 함께 사용할 경우 재설정

c10106 2022. 3. 19. 11:16
반응형

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
}

shouldComponentUpdatesideEffects를 위해 의도된 것은 아니다.성능 편익을 위한 받침 변경에 대한 환원기 렌더 카운트에 사용된다.whichComponentUpdate는 구성 요소를 리렌더할지 여부를 결정하는 true 또는 false를 반환해야 한다.

wasComponentUpdate

사용해도 좋다componentDidUpdate소품 변경 후 발생하는 화재는componentWillReceiveProps소품보다 먼저 발생한 화재는

사용하는 것을 추천한다.componentDidUpdate맘에 들다

componentDidUpdate  = (prevProps, prevState) => {
  if (this.props.data.length !== this.state.data.length) {
     this.setState({
       data: nextProps.data
     })
   }

}

너는 사용해서는 안 된다.shouldComponentUpdate이런 목적으로, 이것 때문에그냥 베끼는 거라면props.datastate.data, 왜 그냥 사용하지 않는가?props.data직접?

모든 업데이트에 복사를 수행해야 하는 경우 다음과 같은 다른 라이프사이클 방법을 사용하십시오.componentDidUpdate또는getDerivedStateFromProps당신은 또한 사용할 수 있다.componentWillReceiveProps그러나 그것은 더 이상 사용되지 않고 있으므로 피해야 한다.

참조URL: https://stackoverflow.com/questions/60567239/react-native-draggable-flatlist-drag-drop-reseting-when-used-with-shouldcomponen

반응형