Element Ui + Vue JS [列偏移不起作用]答案

【问题标题】：Element Ui + Vue JS [Column offset not working]Element Ui + Vue JS [列偏移不起作用]
【发布时间】：2019-02-07 22:59:11
【问题描述】：

我正在为我的应用程序使用 Vue js 前端的 Element UI，我面临的问题是，当我为小型视口设备的列设置偏移量时，它也适用于普通视口。我尝试覆盖框架的 CSS

<el-col :xl="{span: 4, offset: 4}"
:lg="{span: 4, offset: 4}"
:md="{span: 6, offset: 6}"
:sm="{span: 16, offset: 4}">

这里是jsfiddle link，供参考：

【问题讨论】：

不知道您到底出了什么问题。小提琴看起来工作正常。
检查我附上的图片，所有卡片都应该在网格元素 UI 使用的同一行中，有 24 列我将偏移量设置为 4，并将所有其余卡片分成 4 列，每列应该显示为4 column space/ 4 column card *4 / 4 column space again
@Alendorff 如果我使视口足够宽，我可以复制
那么我该怎么做才能解决这个问题呢？ @Alendorff
@NaizamSherMalik 只是为所有列设置一致的道具。例如。像这样（来自第一列的所有道具）jsfiddle.net/mmx38qxw/5546。对于这种情况，最好有一些 const 来绑定，比如：jsfiddle.net/mmx38qxw/5550 它会稍微简化模板，所以你打错字的机会更少。我在这里没有更好的答案，如果你认为 lib 对你来说有问题，你可能应该尝试在 lib github 存储库中打开一个问题。

【解决方案1】：

我面临的问题是，当我为小型视口设备的列设置偏移量时，它也适用于普通视口。

设置为正常视口偏移：0。刚刚测试过，效果很好

【讨论】：