javascript - JSX reactjs 中的样式属性
问题描述
我正在尝试在名为 Gallery 的 reactjs 上实现,它在 html 上看起来像这样:
<div class="grid-gallery" style="--grid-desktop:4; --grid-tablet:4; --grid-phone:4;
--grid-gap:var(--space-base); --grid-list-desktop:5; --grid-list-tablet:5; --grid-list-phone:5;">
<div data-container="" class="column-item-preview">1</div>
<div data-container="" class="column-item-preview">2</div>
<div data-container="" class="column-item-preview">3</div>
<div data-container="" class="column-item-preview">4</div>
<div data-container="" class="column-item-preview">5</div>
<div data-container="" class="column-item-preview">6</div>
<div data-container="" class="column-item-preview">7</div>
<div data-container="" class="column-item-preview">8</div>
</div>
样式上的 css 类的数量几乎没有变化。当我把它放在组件函数的返回中时,由于样式参数,它不起作用。
如何将其“翻译”为 JSX?
解决方案
使用类名而不是类。所以你的代码看起来像 -