javascript - 看。根据 vuex 状态防止窗口关闭

标签 javascript vue.js vuex

所以我想防止我的 Vue App 在 Vuex 状态中有某个值时关闭浏览器窗口。我认为我遇到的问题是 Vuex 存储在生命周期 Hook 中不可用。

这是我正在尝试的:

mounted: function () {
        window.addEventListener('beforeunload', function (event) {
            console.log('unload');
            if (this.$store.state.curOrder != ''){
                event.preventDefault()    
                event.returnValue = ""
            }
        }, false)
    },

当我尝试关闭浏览器窗口时,控制台日志是正确的,但随后出现此错误:

Uncaught TypeError: Cannot read property 'state' of undefined

有什么解决方法可以让我在关闭浏览器之前访问 Vuex?

最佳答案

可能是范围问题,这样试试。

创建一个单独的方法。

methods: {
    onClose(event) {
        console.log('unload');
        if (this.$store.state.curOrder != ''){
            event.preventDefault()    
            event.returnValue = ""
        }
    }
}

对于您的听众,更改为:

window.addEventListener('beforeunload', this.onClose);

关于javascript - 看。根据 vuex 状态防止窗口关闭,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59457165/

相关文章:

javascript - 检测变量是否已在赋值中使用

javascript - 将存储在文件中的 json 分配给 js 变量

vue.js - 使用动态添加的查询参数的用例允许自然后退按钮行为

javascript - 获取 jquery 中的值

php - 按字母表列出,将具有少量条目的字母组合在一起(PHP 或 JS)

javascript - 为什么 "Redirected when going from "/login"to "/"via a navigation guard."出现了?

vue.js - 计算属性不更新 Prop 更改

css - Vuetify.js - 如何在 v-card 中添加横向边框

typescript - Vue + VUEX + typescript + Vue 路由器。组件未被销毁

vuex - 为什么更新数组中的对象在 VUE 中不起作用?