How to render an existing instance in javascript?

Uppy
1

Currently I have a method that initializes Uppy to upload files, that works correctly, the problem I have is that since I have this component on a my own modal, when I open it again, a new instance is created, and if I had already opened it before and I uploaded an image, the previously uploaded files no longer appear.

I have to mention that I have the value returned by this method stored in a global variable that I can access and that is stored when I open it and close the modal.

initializeUppy() {
            const uppy = new Uppy({
              restrictions: {
                maxNumberOfFiles: this.isUniq ? 1 : this.numberOfFiles,
                minNumberOfFiles: this.isUniq ? 1 : null,
                allowedFileTypes: ['image/jpeg', 'image/jpg', 'image/png']
              }
            })
            .use(Dashboard, {
                id: 'Dashboard',
                target: '#uppy-container',
                inline: true,
                locale: this.$i18n.locale === 'es' ? Spanish : English,
                note: this.note,
                autoOpenFileEditor: true,
                height: 525
              })
              .use(Webcam, { target: Dashboard })
              .use(DropTarget, { target: '#uppy-container' })
              .use(ImageEditor, {
                target: Dashboard,
                quality: 0.8,
                cropperOptions: {
                  viewMode: 1,
                  background: false,
                  autoCropArea: 1,
                  responsive: true,
                  croppedCanvasOptions: {},
                  cropBoxResizable: false,
                  initialAspectRatio: this.aspectRatio,
                  dragMode: 'move'
                },
                actions: {
                  cropSquare: false,
                  cropWidescreen: false,
                  cropWidescreenVertical: false
                },
                locale: this.$i18n.locale === 'es' ? Spanish : English
              });
      
            uppy.on('complete', result => {
              this.saveImages(result);
            });
      
            uppy.on('file-removed', (file, reason) => {
              this.removeFile(file);
            });
      
            this.uppyMounted = true;
    
            return uppy;
          }

What I need to do is that when I reopen the modal, the previous instance will be rendered again in the #uppy-container div, but I can’t do it since the div remains blank

2

Maybe the React examples would help you? E.g. the dynamic params and signature for Transloadit example is showing how to use Uppy inside of a component.