如何在 Bootstrap 4.5 中使用 $spacer 变量？

Question

以下是 Bootstrap 的 _variables.scss 文件中 $spacers 的代码：

$spacer: 1rem !default;
$spacers: () !default;
// stylelint-disable-next-line scss/dollar-variable-default
$spacers: map-merge(
  (
    0: 0,
    1: ($spacer * .25),
    2: ($spacer * .5),
    3: $spacer,
    4: ($spacer * 1.5),
    5: ($spacer * 3)
  ),
  $spacers
);

酷，这一切看起来都很有用。但我如何在 scss 中实际使用这些呢？我已经尝试过$spacer-4，，$spacer(4)...$spacers(4)全部抛出错误:(

Answer 1

使用map-get。例如：

.foo {
    padding: map-get($spacers,4)
}

演示： https: //codeply.com/p/wbVojGXN6a