Vue2.x學習筆記:第3章-3:獲取dom節點

1、方法1

獲取dom節點可以用ref屬性,這個屬性就是來獲取dom對象的。看代碼 這個屬性就相當於給這個標籤起了一個id樣的東西

<template>
  <div id="app" v-cloak>
   <input type="text" ref="userinfo" value="binge" />

   <input type="button" value="按鈕" @click="show">

  </div>
</template>
 
<script>
export default {
  name: 'app',
  data () {
    return {
      message:'hello world'
    }
  },
  methods: {
      // 這個 methods屬性中定義了當前Vue實例所有可用的方法
      show: function () {
         alert(this.$refs.userinfo.value)
      }
  }
}
</script>

使用ref,給相應的元素加ref=“name” 然後再this.$refs.name獲取到該元素

2、方法2

直接給相應的元素加id,然後再document.getElementById(“id”);獲取,然後設置相應屬性或樣式

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章