response-native-draggable-flatlist сброс перетаскивания при использовании с shouldComponentUpdate

Question

Я работаю над реактивным приложением, в котором я использую response-native-draggable-flatlist для одного из списка, и, к сожалению, мне приходится использовать shouldComponentUpdate в компоненте для манипулирования данными из другого элемента списка в другом компоненте, но после добавления shouldComponentUpdate, мое перетаскивание не работает, я могу перетаскивать, но он немедленно сбрасывает весь список в исходное положение.

Пожалуйста, помогите мне с некоторыми предложениями, как заставить работать перетаскивание вместе с shouldComponentUpdate, поскольку я не хочу нарушать существующую функциональность

Код

<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
}

Answer 1

shouldComponentUpdateне предназначен для выполнения побочных эффектов. Он используется для подсчета рендеринга редуктора для изменений свойств для повышения производительности. shouldComponentUpdate должен возвращать true или false, определяя, должен ли компонент повторно визуализироваться.

shouldComponentUpdate

Вы можете использовать componentDidUpdate который срабатывает после изменения реквизита, отражает или componentWillReceiveProps который срабатывает до отражения опоры

Я рекомендую использовать componentDidUpdate нравиться

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

}

Answer 2

Вы не должны использовать shouldComponentUpdateдля этого. Если вы просто копируетеprops.data в state.data, почему бы просто не использовать props.data прямо?

Если абсолютно необходимо выполнять копирование при каждом обновлении, рассмотрите возможность использования другого метода жизненного цикла, например componentDidUpdate или getDerivedStateFromProps. Вы также можете использоватьcomponentWillReceiveProps, но он устарел, и его следует избегать.