Vue/Vuetify - 基于组件大小的断点

Question

据我所知，Vuetify 允许您根据视口大小定义断点。是否也可以根据组件的大小定义断点？例如

• 当多个组件显示在概览页面上时，它将使用更“紧凑”的布局，以便能够在大屏幕上并排显示组件。
• 当仅显示一个组件时，它可能会占用更多空间（在大屏幕上）。
• 当小屏幕上仅显示一个组件时，也可以使用“紧凑”布局。
• 在小屏幕上，概述页面可以垂直而不是并排显示多个组件。

或者你能推荐一个更好的方法吗？

Answer 1

据我所知，Vuetify 中没有这样的功能。但是，您始终可以隐藏v-col包含该组件的内容，其他列将占用释放的空间。

例如： https: //codepen.io/olegnaumov/pen/rNpzvEX