让我们从一个示例开始：https://jsfiddle.net/ilyamilosevic/7nxv8cof/。因此，在示例中，我们将grid-template-columns的值设置为repeat(${n}, 1fr)，其中n是列数。在Chrome（或Firefox中，无所谓）中打开devTools后，我们看到，前面提到的属性的值实际上是grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr的简单替代（repeat(10, 1fr)）。您可以将其称为“挑剔”，但我很感兴趣为什么会这样。
附加信息：
视窗;
Chrome 57.0.2987.110 32位；
Firefox 52.0.1 32位。
最佳答案
如果您遵循规范的步骤，则会看到
setProperty
5.令组件值列表为属性property的parsing值的结果。
然后
parsing
1.让列表成为通过从值调用parse a list of component values返回的值。
然后
parse a list of component values
1.重复consume a component value直到返回，然后将返回的值（final除外）附加到列表中。返回列表。
差不多了
consume a component value
否则，如果当前输入令牌是，则consume a function并将其返回。
最后
consume a function
创建一个名称等于当前输入令牌值的函数，并且其值最初是一个空列表。
重复使用下一个输入令牌并按以下步骤处理：
返回函数。
这是一个解析错误。返回函数。
还要别的吗
重新使用当前输入令牌。使用组件值并将返回的值附加到函数的值。
简而言之，当它是一个函数时，它将被执行并分配结果。