苗条的 JavaScript 风格答案

【问题标题】：Svelte JavaScript In style苗条的 JavaScript 风格
【发布时间】：2021-09-03 01:04:27
【问题描述】：

在我的样式组件中，我有一个类可以更改按钮的背景颜色，如下所示：

<style>
.button:global(:nth-child(2)) {
    background-color: red;
  }
</style>

我的问题是我不希望第 n 个孩子硬编码，我希望它是一个变量，如下所示。

<script>
let x = 5
</script>

<style>
.button :global(:nth-child(x)) {
    background-color: red;
  }
</style>

这可能吗？

【问题讨论】：

我不打算将其转换为答案，其他人可以，但这里是 DuckDuckGo 上的第一个结果“样式标签中的细长变量”：svelte.school/tutorials/… ，这似乎是你所需要的

【解决方案1】：

不，这是不可能的，唯一的是可以使用 style 属性在元素上设置属性（或自定义属性），但这些不能用作 @987654321 的参数@

【讨论】：