Vue.js雖然說是資料驅動頁面的，但是有時候我們也要獲取dom物件進行一些操作。

vue的不同版本獲取dom物件的方法不一樣

Vue.js  1.0版本中，通過v-el繫結，然後通過this.els.XXX來獲取

Vue.js  2.0版本中。我們通過給元素繫結ref=“XXX”，然後通過this.$refs.XXX或者this.refs['XXX']來獲取

以2.0為例：

<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['hello']);
        console.log(this.$refs.hello);
      }
    }
  }
 
</script>

vue中操作dom需要謹慎，尤其是新增或刪除dom的時候，特別是mounted()和created()的時候，此時dom物件還沒有生成，要放在this.nextTick()的回撥函式中。

嗯，就醬~~