Elius94 / react-photo-sphere-viewer

Photosphere Viewer for React.JS
MIT License
65 stars 21 forks source link

Two viewers are created using React 18 and strict mode #20

Closed alexjball closed 1 year ago

alexjball commented 1 year ago

First off, thank you for putting this library together!!

I need the photo sphere to be reactive to the src url so I can easily change the displayed image. Here is the basic code

export const PhotoSphereViewer: FC<{ src: string }> = ({
  src,
}) => {
  const ref = useRef(null)

  useUpdateEffect(() => {
    // The library does not propagate updates to the URL, so update it if src changes.
    ref.current?.setPanorama(src).then(
      v => console.log('success', v),
      v => console.log('error', v)
    )
  }, [src])

  return <ReactPhotoSphereViewer ref={ref} src={src} />
}

If strict mode is off, this works perfectly. If strict mode is on, the viewer does not update but I observe 'success' in the console, indicating that the underlying viewer updated the view.

Strict mode mounts components twice, and that seems to cause two viewers to be created (this line runs twice).

I can see two viewers in the page markup.