VueJs - 在窗口调整大小时添加类

Question

Using Vuejs, what is the correct way to add and remove a class depending on what size the browser window is?

I've been looking at 'v-transitions', however, all the examples I have come across are using an on click event.

Answer 1

I think that the best option is to add a native window event listener on component mounted and manage classes depending on dimensions.
Then you might use :class="..." binding ( https://v2.vuejs.org/v2/guide/class-and-style.html ) in your template and pass an array of classes there.
Look at this fiddle for a very close example https://jsfiddle.net/hr77p7qb/3/