Как остановить страницу обновления XMLHttpRequest - PullRequest
0 голосов
/ 28 декабря 2018

Я работаю над приложением реагирования и реализовал метод загрузки файла по нажатию кнопки, я вызываю следующую функцию при нажатии для загрузки файла.Он отлично работает, но также обновляет страницу.Как я могу остановить обновление страницы после загрузки файла?

printClientsData(popupResponse) {
        this._confirmPopup.closePopup();
        if (popupResponse) {
            this.setState({
                loading: true,
                showLoadingMsg: true,
                loadingText: 'Generating PDF...',
            })
            var req = new XMLHttpRequest();
            req.open("POST", "http://example.com", true);
            req.setRequestHeader("Content-Type", "application/json");
            req.setRequestHeader("x-auth-token", localStorage.getItem('token'));

            req.responseType = "blob";

            req.onreadystatechange = (e) => {
                if (req.readyState === 4 && req.status === 200) {
                    let filename = "PdfName-" + new Date().getTime() + ".pdf";
                    let myHeader = req.getResponseHeader('file-name');
                    if (myHeader !== null) {
                        filename = myHeader;
                    }
                    if (typeof window.navigator.msSaveBlob === 'function') {
                        window.navigator.msSaveBlob(req.response, filename);
                        this.setState({
                            loading: false,
                            showLoadingMsg: false
                        })
                        NotificationManager.success('QR Code Generated Successfully');
                    } else {
                        var blob = req.response;
                        var link = document.createElement('a');
                        link.href = window.URL.createObjectURL(blob);
                        link.download = filename;

                        document.body.appendChild(link);
                        link.click();
                        this.setState({
                            loading: false,
                            showLoadingMsg: false
                        })
                        NotificationManager.success('QR Code Generated Successfully');
                        return false
                    }
                    e.preventDefault()
                }

            };
            req.send(JSON.stringify(this.selectedClients));

        }

    }

1 Ответ

0 голосов
/ 28 декабря 2018

Это случилось со мной тоже.Я настолько глуп, что в моем методе рендеринга моя кнопка находится внутри элемента формы, поэтому каждый раз, когда я нажимаю кнопку, она обновляет страницу.Поэтому обязательно добавьте свойство type = "button" в кнопку или добавьте предотвратите ошибку в свойстве "onSubmit" в форме

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...