js瀏覽器縮放提示

　　data() {
        return {
            instance: null,
            isZoomOpen: false
        };
    },

　　mounted() {
        const that = this;
        this.isZoom();
        window.addEventListener("resize", function() {
            that.isZoom();
        });
    },

　　methods: {
        // 瀏覽器縮放提示 （打開控制台會影響准確度）
        detectZoom: function() {
            let ratio = 0,
                screen = window.screen,
                ua = navigator.userAgent.toLowerCase();
            //
            if (~ua.indexOf("firefox")) {
                if (window.devicePixelRatio !== undefined) {
                    ratio = window.devicePixelRatio;
                }
            } else if (~ua.indexOf("msie")) {
                if (screen.deviceXDPI && screen.logicalXDPI) {
                    ratio = screen.deviceXDPI / screen.logicalXDPI;
                }
            } else if (
                window.outerWidth !== undefined &&
                window.innerWidth !== undefined
            ) {
                ratio = window.outerWidth / window.innerWidth;
            }
            //
            if (ratio) {
                ratio = Math.round(ratio * 100);
            }
            // 360安全瀏覽器下的innerWidth包含了側邊欄的寬度
            if (ratio !== 100) {
                if (ratio >= 95 && ratio <= 105) {
                    ratio = 100;
                }
            }
            return ratio;
        },
        isZoom: function() {
            if (this.detectZoom() < 100 || this.detectZoom() > 100) {
                this.zoomNotifyOpen();
            } else {
                this.zoomNotifyClose();
            }
        },
        zoomNotifyOpen: function() {
            if (!this.isZoomOpen) {
                this.isZoomOpen = true; // 加上標記防止多次提示
                this.instance = this.$notify({
                    title: "提示",
                    message:
                        "你的瀏覽器目前處於縮放狀態，頁面可能會出現錯位現象，建議100%大小顯示",
                    type: "info",
                    duration: 0
                });
            }
        },
        zoomNotifyClose: function() {
            if (this.instance !== null) {
                // 判斷是否為null 防止bug
                this.instance.close();
                this.isZoomOpen = false;
            }
        }
    }