Добавить атрибут к каждому тегу в vue

Question

У меня есть проект vue с большим количеством тегов <img внутри моего шаблона. Есть много компонентов с еще большим количеством изображений. Теперь я хочу отключить перетаскивание для них всех.

Первое, что приходит на ум, - это grep файлы для тегов <img и добавление draggable="false" к каждому изображению внутри каждого шаблона.

Интересно, смогу ли я сделать это в одном месте, например, в глобальном миксине или что-то в этом роде.

Answer 1

Одним из решений является регистрация прослушивателя событий для события dragstart в элементе документа и предотвращение операции перетаскивания, если целью было <img>:

document.addEventListener('dragstart', e => {
  if (e.target.tagName === 'IMG') {
    e.preventDefault()
  }
})

Answer 2

Вы можете попробовать это на ваших навесных крюках:

mounted(){
    this.$nextTick(()=>{
       let allimages = document.querySelectorAll("img");
       for (var i = 0;i < allimages.length; i++){
          allimages[i].setAttribute("draggable", "false");
        }
    })
} // end of mounted hook