Я реализую галерею изображений. Существует список изображений в квадрате, если пользователь longPress компонент изображения, он будет повторно визуализирован в выбранный компонент изображения, на котором отображается размытый фон и отметка сверху изображения.
Вот обычный компонент изображения:
<TouchableOpacity
key={index}
onPress={this.normalModeImgClick(img, index)}
onLongPress={this.startSelectMode(index)}
>
<Image style={styles.img} source={{uri: img.resized_xs_url}}/>
</TouchableOpacity>
Вот компонент в режиме выбора:
<TouchableOpacity
key={itemIndex}
style={styles.selectedImgWrapper}
onPress={this.selectModeImgClick(imgItem, itemIndex)}
>
<Image style={styles.img} source={{uri: imgItem.img.resized_xs_url}}/>
{imgItem.selected &&
<View style={styles.selectedImgCover}>
<Image style={styles.selectedIcon} source={require('../../assets/icon_tick.png')}/>
</View>
}
</TouchableOpacity>
Как вы можете видеть, если вы долго нажмете на обычный компонент изображения, сработает startSelectMode
, и это изображение будет перерисовано и превращено в компонент выбора режима. Тем не менее, selectModeImgClick
также будет запущен, что не предполагается (так как пользователь все еще выполняет действие longPress).
Как предотвратить это?