可以通过以下方法来处理Axios全局错误处理程序未显示带有错误的模态框的问题:
axios.interceptors.response.use(null, (error) => {
if (error.response.status === 404) {
console.log('404 error');
} else {
console.log('other error');
}
return Promise.reject(error);
});
const errorModal = document.getElementById('error-modal');
const errorMessage = document.getElementById('error-message');
const closeErrorModal = document.getElementsByClassName('close')[0];
function displayErrorModal(message) {
errorMessage.innerHTML = message;
errorModal.style.display = 'block';
}
closeErrorModal.addEventListener('click', () => {
errorModal.style.display = 'none';
});
window.addEventListener('click', (event) => {
if (event.target == errorModal) {
errorModal.style.display = 'none';
}
});
axios.interceptors.response.use(null, (error) => {
if (error.response.status === 404) {
console.log('404 error');
} else {
displayErrorModal('An error has occurred. Please try again later.');
}
return Promise.reject(error);
});