How to make viewport() responsive in computed property?

[mesqueeb]

I need to use one of the quasar breakpoints in Vue as a computed property.
However, the viewport() doesn’t get updated when making the screen bigger / smaller…

import { dom } from 'quasar'
const { viewport } = dom
let { width } = viewport()
export default {
  computed: {
    vp () {      
      return width
    },
    ltSm () { return (this.vp < 768) },
  },

Any ideas?

[wilcorrea]

My way would be http://quasar-framework.org/components/window-resize-observable.html

[benoitranque]

Also notice in your code, you grab width once. No reason the width property would be reactive.

I think…

Maybe this would work?

 computed: {
    vp () {      
      return dom.viewport().width
    },
    ltSm () { return (this.vp < 768) },
  },

Untested. Also take a look at what @wilcorrea posted