jobtoday/react-native-image-viewing

When I chance the imageIndex the ImageView closes and opens again. why is this?

Opened this issue · 7 comments

When I chance the imageIndex the ImageView closes and opens again. why is this?

same error. 改了源码,已经解决. 感谢提供这样的组件.

Same here

To prevent this from happening don't use the onImageIndexChange handler to set a state which is used on the imageIndex.

eg:

const [imageViewImageIndex, setImageViewImageIndex] = React.useState(0);
const [imageViewIsVisible, setImageViewIsVisible] = React.useState(false);

<ImageView
  imageIndex={imageViewImageIndex}
  visible={imageViewIsVisible}
  ...
/>

<Pressable
  onPress={() => {
    setImageViewImageIndex(index);
    setImageViewIsVisible(true);
  }}>
  <Image ...  />
</Pressable>

I managed to bypass this by using two index states.
The startIndex is used when you press an image, it will set the initial index and open the viewer, the imageIndex is used by the ImageView to update the index.

const [imageIndex, setImageIndex] = useState<number>(0); 
const [startIndex, setStartIndex] = useState<number|null>(null);
const showImageView = startIndex === 0 || !!startIndex;

 <ImageView
  images={[]}
  imageIndex={startIndex || 0}
  onImageIndexChange={setImageIndex}
  visible={showImageView}
  />

any solution ??

same issue here..

怎么改的

image

sad to see this, you guys can just adjust this part in case to prevent remounting