Как сделать прелоадер отправки данных на кнопке через Axios?

Question

[Vladislav]

Как сделать прелоадер отправки данных на кнопке через Axios? При клике на кнопку отправки, в состоянии между отправки и успешном отправлении данных стоит прелоадер на кнопке, думаю многие сталкивались с таким. Использую Axios, которые в then успешная отправка, а в catch ошибка, вот как в состояние между ними добавить прелоадер, именно логику на чистом js, а не верстку

Comments

[iBird Rose]

а в чем сложность? запускаешь лоадер перед тем как axios начинает выполняться и завершаешь к примеру при .finally()

[Вадим]

button.classList.add('with-loader')
request()
  .then()
  .catch()
  .finally(function(){
    button.classList.remove('with-loader')
  })

Только обратите внимание что у .finally не супер широкая браузерная поддержка. Если Вам не подходит - сделайте вызов этой функции в .then и .catch

[Vladislav]

Вадим, спасибо большое