苗条的动态风格处理

Question

是否有另一种方法而不是将样式直接写入原始样式标签？:

<div style="width: {width}; height: {height};">ᕕ( ᐛ )ᕗ</div>

或者；在这种情况下，交付的样式可以是任何东西/是动态的，而不是可预分类的，最佳实践是什么？

Answer 1

这是一个例子：

<script>
  let bgcol="blue"
  let style=`color:red;background-color:${bgcol}`
</script>  
    
<h1 {style}> Hello <h1>

编辑：对于 style={style}

，{style} 是 shorthand

您可以从 REPL 中找到工作示例：

Svelte dynamic style handling