vue实时获取页面的宽度，自适应屏幕

    data(){
        return{
            fullWidth:document.documentElement.clientWidth
        }
    },
    created(){
        window.addEventListener('resize', this.handleResize)
    },
    beforeDestroy: function () {
        window.removeEventListener('resize', this.handleResize)
    },
    computed:{
        ...mapGetters([
            'isCollapse',
        ]),
        rightWidth(){
            let leftWidth = this.isCollapse ? '64' : '200';
            console.log(this.fullWidth)
            return (this.fullWidth-leftWidth)+'px'
        }
    },
    methods: {
        handleResize (event) {
            this.fullWidth = document.documentElement.clientWidth
        },
    }  

仅供个人参考 笔记使用