Comment obtenir des éléments dans vuejs

Méthode Vuejs pour obtenir des éléments : 1. Ouvrez le fichier de code correspondant ; 2. Liez "ref="XXX"" à l'élément ; 3. Passez "this.$refs.XXX" ou "this.refs['XXX'". ]" pour l'obtenir.

L'environnement d'exploitation de cet article : système Windows 7, Vue version 2.0, ordinateur DELL G3.

Comment obtenir des éléments dans vuejs ?

Obtenir des éléments dom dans Vue

Bien que Vue.js soit une page basée sur les données, nous avons parfois également besoin d'obtenir des objets dom pour effectuer certaines opérations.

Différentes versions de vue ont différentes méthodes pour obtenir des objets dom.

Vue.js 1.0, via la liaison v-el, puis obtenez-le via this.els.XXX

Vue.js 2.0. Nous lions ref="XXX" à l'élément, puis l'obtenons via this.$refs.XXX ou this.refs['XXX']

Prenons 2.0 comme exemple :

<template>
  <section>
    <div ref="hello">
      <h1>Hello World ~</h1>
    </div>
    <el-button type="danger" @click="get">点击</el-button>
  </section>
</template>
<script>
  export default {
    methods: {
      get() {
        console.log(this.$refs[&#39;hello&#39;]);
        console.log(this.$refs.hello);
      }
    }
  }
</script>

Vous devez être prudent lors de l'utilisation de dom dans vue , en particulier lors de l'ajout ou de la suppression de dom, en particulier lorsqu'il est monté() et créé(), l'objet dom n'a pas encore été généré, il doit donc être placé dans la fonction de rappel de this.nextTick().

Et bien c'est tout~~

Recommandé : "La dernière sélection de 5 tutoriels vidéo vue.js"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!