ref属性をつかったWidthの取得の個人メモ
現在のWidthを知りたい要素にref属性を追加する
<template>
<div class="parentWidth" ref="getParentWidth">
.
.
.
</div>
</template>
mountedプロパティ以降に記述する(DOMが描画されてからでないと取得できないため)
mounted () {
// 要素の幅を取得するメソッド
this.getTargetWidth()
// ユーザーがウィンドウサイズを変更したら実行されるようにする
window.addEventListener('resize', this.getTargetWidth)
},
methods: {
getTargetWidth () {
let targetWidth = this.$refs.getParentWidth.clientWidth
console.log(targetWidth) // 要素の幅をInt型で取得する事ができる
}
}