Vue.js Vuejs如何在宽度更改时查看元素currentStyle

我有一个菜单组件和组件a，但我想观察菜单在组件a中何时展开和折叠

我已经在componentA数据属性中定义了menuWatcher

const ComponentA = {
    data:function(){
        return {
          menuWatcher:(document.getElementById('menu-area').currentStyle || window.getComputedStyle(document.getElementById('menu-area')))
        };
    },
    watch:{
        "menuWatcher.width"(width){
            alert(width);
        }
    }
};

当我展开和折叠菜单时，我希望观察者提醒宽度，但它不起作用

---

请有人提出一个更好的解决方法。

我不建议做像

document.getElementById（'menu-area'）.currentStyle这样的事情。这不好有几个原因

我会选择：

在菜单组件上，我将菜单的状态绑定到一个变量。
这就带来了两件事：


程序切换
儿童的过世状态

你可以看看这个。我草草写了一个你想要的原始版本。
我不建议做像
document.getElementById（'menu-area'）.currentStyle这样的事情。这不好有几个原因

我会选择：

在菜单组件上，我将菜单的状态绑定到一个变量。
这就带来了两件事：


程序切换
儿童的过世状态

你可以看看这个。我草草写了一个你想要的原始版本