Nuxt js 中的计算引导断点

【问题标题】：Computed Bootstrap Breakpoints in Nuxt jsNuxt js 中的计算引导断点
【发布时间】：2021-03-03 08:23:30
【问题描述】：

对于仅在 NuxtJs 应用程序中的客户端中具有实时活动的 Bootstrap 断点（如计算数据）的最佳解决方案是什么？

在 Bootstrap 中，我们有像 d-lg-block 这样的类。我想在 VueJs 中使用 v-if 来做到这一点。像： <div v-if="lgAndUpper"></div>

【问题讨论】：

【解决方案1】：

你可能需要这个。调整浏览器大小后，将触发此事件。你可以把它放在mounted() 让它工作。

window.addEventListener("resize", function(event) {
    console.log(document.body.clientWidth + ' wide by ' + document.body.clientHeight+' high');
})

【讨论】：