Vuetify 突然显示不同的保证金？

Question

我正在做一个项目。我开始在一个新地点开展该项目，我发现所有利润率都不一样！而 package.json 是一样的。所以唯一的区别是新 npm install。例如 .row class 有 margin-right: -12px; marging-top:-12px 而在另一个位置它是 margin: -12px.

我删除了第一个位置的 node_modules 文件夹和运行 npm install。现在第一个位置与第二个位置完全相同，所有方向的 marging 等于 -12px。但我相信 .row class 的保证金在底部和顶部必须为零。

为什么？

Answer 1

听起来 vuetify 已更新。几周前我们刚刚经历过同样的问题。由于 Vuetify Version 2.4.0

中对 v-row 进行了重大更改

我们刚刚删除了 v-row 标签中的所有负面 paddings/margins 并解决了问题。

在 issues page

上找到的另一个解决方案

.row {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

这是来自 release notes 的片段：

v-row now has negative vertical margins in addition to the existing horizontal ones in order to fix spacing when grid components are nested (issue #11408). This change is known to cause layout problems in some cases but should be easy to fix. Discussion about this can be found in #12848.

Workarounds for #11408 If you were applying your own negative margins or overriding the v-col padding you will need to remove these workarounds now that the bug has been fixed.

Vuetify 突然显示不同的保证金？

Vuetify suddenly shows different margin?

vue.js

vuetify.js