Это хорошо, чтобы получить доступ к DOM в VUE JS?

Question

Я хочу знать, нормально ли для доступа к DOM в приложении Vue js? Например, если я хочу добавить элемент (div) в тег body, рекомендуется ли использовать document.getElementById в методе Vue js?

У меня нет данных, которые можно использовать для создания или удаления элементов на основе данных. Я действительно просто хочу знать, распространено ли использование document для доступа к DOM в Vue js?

Примерно так:

methods:{
 appendToBody(){
   let node = document.createElement("div");
   document.getElementById("#body").appendChild(node);
 }
}

Answer 1

Это зависит от того, на какую часть DOM вы также ссылаетесь.

Если вы хотите изменить поддерево, которое обрабатывается Vue, вам не следует делать это . Вы должны полагаться на реактивные свойства, условный рендеринг , компоненты. Если вам нужен доступ к элементу DOM, который является дочерним по отношению к текущему компоненту, вы можете использовать refs .

Если вам нужно изменить часть DOM, которая находится за пределами сферы действия Vue, то непременно сделайте это.

В вашем случае неясно, чего вы хотите достичь, и сложно дать четкий ответ.

Answer 2

Вы можете использовать функции DOM, такие как document.getElementById в Vue, чтобы найти элементы, но никогда не используйте функции DOM для изменения DOM. Всегда вносите изменения в Vue, изменяя переменные и реагируя на это в шаблоне.