ant design vue 监听浏览器窗口变化 不重新加载页面

在Ant Design Vue中，您可以使用`Vue`中提供的官方方式来监听浏览器窗口变化而不重新加载页面。下面是一个简单的示例：

首先，在您的组件中导入`Vue`和`ant-design-vue`：

import Vue from 'vue';
import { debounce } from 'ant-design-vue';

然后，您可以使用`Vue`提供的生命周期函数`mounted`来监听窗口大小的变化：

mounted() {
  this.$nextTick(() => {
    window.addEventListener('resize', this.handleResize);
  });
},

在这个例子中，我在组件的`mounted`生命周期函数中注册了一个`resize`事件的监听器，并将其与一个叫做`handleResize`的方法绑定。

接下来，您需要在组件中定义`handleResize`方法来处理窗口大小的变化：

methods: {
  handleResize: debounce(function() {
    // 处理窗口大小变化的逻辑
  }, 300),
},

在这个例子中，我使用了`debounce`函数，它可以将频繁触发的事件缩减为一定时间内只触发一次。这样可以避免事件过于频繁地触发，提高性能。

最后，不要忘记在组件销毁时移除窗口大小变化的监听：

beforeDestroy() {
  window.removeEventListener('resize', this.handleResize);
},

通过添加类似上述代码，在Ant Design Vue中您就可以监听浏览器窗口变化而不重新加载页面了。当窗口大小变化时，`handleResize`方法会被调用，您可以在其中添加适当的逻辑来应对窗口大小变化所带来的变化。