vue.js - v-navigation-drawer进入窗口调整大小的失控循环

首先，让我说v-navigation-drawer按预期工作，即：
在点击汉堡包菜单时，提交ToGGLYL抽屉变形，并切换打开/关闭，更新状态。
在窗口调整大小时，它在指定的断点处打开/关闭
所以有效。
但是，窗口大小调整不能正确地切换突变，并且当调整窗口大小时，我总是会得到一个VUEX突变错误：

我明白为什么我会犯这个错误-变异器之外的$store.state.ui.drawer正在被修改（这是v-navigation-drawer的v-model）：

<v-navigation-drawer
        v-model="$store.state.ui.drawer"
        app
        clipped
    >

我知道把状态绑定到v模型是不好的。但是，当我试图用drawer和get()方法做出一个set()计算属性时，该方法正确地得到/引发了一个突变，浏览器崩溃了（大概是因为SET方法触发了一个无限循环的提交，切换drawer true /false为无穷大）：

computed: {
            drawer: {
                get () {
                    return this.$store.state.ui.drawer
                },
                set () {
                    this.$store.commit('TOGGLE_DRAWER') // <--crashes the browser
                }
            }
        }

我一直在寻找解决这个问题的办法。它困扰着我，即使它在视觉上似乎是工作。
我考虑过在stateless模式下运行v-navigation-drawer并手动处理所有窗口大小调整事件和状态更新。我还考虑过在Vuex中禁用“严格”模式（这将隐藏错误）。但前者是更复杂的，后者是一个创伤性的创伤性测试。

最佳答案

这听起来是Lodash's debounce函数的完美候选。如果在应用此效果时需要坚持使用setter/getter，请查看this post；否则，请查看this one以获取任何生命周期挂钩上的顺序事件订阅。

关于vue.js - v-navigation-drawer进入窗口调整大小的失控循环，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/57984763/