在Slim中处理数据属性的最佳方法

Question

我正在评估 Slim 作为个人项目中 HAML 的替代品，并且它似乎不像HAML那样优雅地处理HTML5数据属性。我希望有人也可能碰到这个，或者可能已经知道我在他们的文档中还没有找到的选项/语法。

HAML允许您只使用嵌套的哈希来定义HTML 5 data attributes，如下所示：

%a{data: {key1: 'val', key2: 'val'}}

导致

<a data-key1='val' data-key2='val'></a>

Answer 1

Slim有多种方式

1. 作为哈希

     

   如果给出哈希将被连字的属性（例如data = {a：1，b：2}将呈现为data-a =“1”data-b =“2”）

2. 直接使用它，因为“mu太短”，非常直观。

   a data-title="help" data-content="foo"
   

3. 使用Ruby代码。我经常这样做而很少上面。

   = link_to 'foo', bar_path, data: {a: 'a', b: 'b'}
   

Answer 2

使用 splat 运算符：

h1#section-title*{'data-url'=>'test', 'data-id'=>'test'} = @project.name

Answer 3

Smallint

会产生

.your-class*{data: {first_attribute: 'first value', second_attribute: 'second value'} }

Answer 4

我更喜欢这种方式......

@products.each do |product|
  .module data-id=product.id

这对我有用