VueコンポーネントでWindowサイズ変更検知＆値取得 - Qiita

実装方法 ブラウザのリサイズはwindowのイベントでVueが直接関与する部分ではないため、コンポーネントの作成時にイベントリスナを追加します。コンポーネント削除時には、忘れずにイベントリスナも削除します。 サンプルコード <template> <div> <p>window width: {{ width }}</p> <p>window height: {{ height }}</p> </div> </template> <script> export default { data: function () { return { width: window.innerWidth, height: window.innerHeight } }, methods: { handleResize: function() { // resizeのたびにこいつが発火するので、ここでやりたいこと