我们有旧的VueJS+Vuetify应用程序，我们正在转换为VueJS 3。我们在模板中定义了一些类，这些类在新版本中不可用。有像xs12（假设覆盖全屏），text-xs-left（假设设置左对齐文本），offset-xs2（假设设置偏移量）这样的类。在VueJS 2 +Vuetify中有很多这样的类，这些类在新版本中缺失。如何在新的VueJS3+Vuetify中添加这些类？
xs12
text-xs-left
offset-xs2
wwtsj6pe1#
删除xs类是为了支持无断点版本，即text-left而不是text-xs-left。一个大小的规范适用于所有更大的大小，由于xs是最小的大小，因此该级别的规范适用于所有其他大小，与无断点版本相同。对于文本类，这在升级指南中提到：.text-xs-{alignment}已重命名为.text-{alignment}，以反映它适用于所有断点的事实。（我认为偏移量和列类被认为是内部的，没有关于它们的文档。所以你要么自己添加这些类，要么更新这些类：
xs
text-left
.text-xs-{alignment}
.text-{alignment}
v-col-12
offset-2
offset-lg-2
1条答案
按热度按时间wwtsj6pe1#
删除
xs类是为了支持无断点版本，即text-left而不是text-xs-left。一个大小的规范适用于所有更大的大小，由于xs是最小的大小，因此该级别的规范适用于所有其他大小，与无断点版本相同。对于文本类，这在升级指南中提到：
.text-xs-{alignment}已重命名为.text-{alignment}，以反映它适用于所有断点的事实。（我认为偏移量和列类被认为是内部的，没有关于它们的文档。
所以你要么自己添加这些类，要么更新这些类：
xs12：使用v-col-12（这个也被重命名）text-xs-left：使用text-leftoffset-xs2：使用offset-2（更大的尺寸现在在断点和宽度之间有一个破折号，即offset-lg-2）