Vue取得要素位置getBoundingClientRect is not a function

inputをクリックして要素の位置を取得
最初にrefを使用してdom要素を取得し、getBoundingClientRect()メソッドを呼び出します.

  


methods: {
   getInput () {
      let obj = this.$refs['inputDom']
      let objSet = obj.getBoundingClientRect()
      console.log(objSet)
   }
}

コンソールが間違っているgetBoundingClientRect is not a function
refで取得したdom要素であるobjがVueComponentであることを確認し、以下の書き方に変更すればOKです

  


methods: {
   getInput: function (e) {
      let obj = e.target
      let objSet = obj.getBoundingClientRect()
      console.log(objSet)
   }
}

コンソール出力結果DOMRect{x:296,y:139,width:206.25,height:32,top:139,...}
このときe.targetを用いて取得するobjオブジェクトはinputである.ivu-input.ivu-input-default