vue监听屏幕变化

因为我需要监听屏幕宽度的变化，但是又不是每一个页面都需要，然后我就将下面的代码写到了一个js文件里面，通过mixin引入到需要的页面

监听屏幕变化的js文件：

export const screenWidth = {
   data() {
           return {
               screenWidth: null,
           }
       },
       created() {
           this.windowWidth(document.documentElement.clientWidth);
       },
       mounted() {
           window.onresize = () => { //屏幕尺寸变化就重新赋值
               return (() => {
                   this.screenWidth = document.documentElement.clientWidth
               })()
           }
       },
       methods: {
           windowWidth(value) {
               this.screenWidth = value
           }
       },
}

　在需要该方法的地方引入

 import {screenWidth} from '@/地址/mixins/screenWidth'
export default {
  mixins: [screenWidth],
}

　　然后就可以使用this.screenWidth了