Question

我用riot.js制作了一个标题组件，在某些页面上应该有不同的样式。我想在html文档中安装标记时设置类，但无法弄清楚如何。标签看起来像这样：

<o-header>
    <header class={ opts.structure, opts.overflow, opts.color }>
    ...
    </header>
</o-header>

以下是安装：

riot.mount('o-header',
{
    structure: 'o-header',
    overflow: 's-overflow--hidden',
    color: 'm-header--navy',
})

这是语法错误还是我在这里滥用了opts功能？

Answer 1

这是一个有趣的选项用例。

提供多个动态类的格式如下，

<o-header>
  <header class="{opts.structure} {opts.overflow} {opts.color}">
  ...
  </header>
</o-header>

为了更进一步，您可以将此语法应用于条件类

<o-header>
  <header class="{true ? opts.structure: ''} {true ? opts.color : ''}">
  ...
  </header>
</o-header>

<强>参考：