vue js 'document.getElementById' stenografia

Question

Czy vue js ma skrót do document.getElementById('#id'), podobnie jak JQuery's $('#id')?

Jeśli tak, to gdzie jest to odniesienie w dokumentach, aby można było znaleźć inne informacje?

Answer 1

Możesz użyć dyrektywy v-el, aby zapisać element, a następnie użyć go później.

https://vuejs.org/api/#vm-els

<div v-el:my-div></div> 
<!-- this.$els.myDiv ---> 

Edit: To jest przestarzałe w Vue 2, zobacz 胡亚雄 odpowiedzieć

Answer 2

Jeśli próbujesz uzyskać element można użyć Vue.util.query który jest naprawdę tylko otoki wokół document.querySelector ale 14 znaków w porównaniu do 22 znaków (odpowiednio) jest technicznie krótszy. Obsługuje także błędy w przypadku, gdy szukany element nie istnieje.

Nie ma żadnej oficjalnej dokumentacji na Vue.util, ale to cała źródłem funkcji: link

function query(el) { 
    if (typeof el === 'string') { 
    var selector = el; 
    el = document.querySelector(el); 
    if (!el) { 
     ({}).NODE_ENV !== 'production' && warn('Cannot find element: ' + selector); 
    } 
    } 
    return el; 
} 

Repo: Vue.util.query

Answer 3

Tam nie skrótowym sposobem w Vue 2.

Metoda Jeffa wydaje się już przestarzała w vue 2.

Jest inny sposób, w jaki możesz osiągnąć swój cel.

<div id="myDiv" ref="myDiv"> 
</div> 

methods: { 

    showMyDiv() { 
     console.log(this.$refs.myDiv); 
    } 
} 

Answer 4

można znaleźć odpowiedź w kombinacji tych dwóch stron w API:

• REF

ref jest używany do rejestracji w odniesieniu do elementu lub element potomny . Referencja zostanie zarejestrowana pod obiektem $ refs jednostki nadrzędnej . Jeśli używany na prostym elemencie DOM odniesienie będzie ten element

• vm.$refs

Obiekt, który posiada elementy potomne, które zostały zarejestrowane ref.

Answer 5

Staraj się nie robić manipulacji DOM odwołując DOM bezpośrednio, będzie miał wiele kwestii wydajności, również obsługa zdarzeń staje się bardziej skomplikowane, gdy staramy się uzyskać dostęp do DOM bezpośrednio, zamiast korzystać z danych i dyrektyw do manipulowania DOM.

Zapewni to większą kontrolę nad manipulacją, a także będzie w stanie zarządzać funkcjami w formacie modułowym.