Question

我在车把中有一个名为“ section”的部分，定义如下：

<div{{#if class}} class="{{class}}"{{/if}}>
  <h3>{{ title }}</h3>
  {{> @partial-block }}
</div>

在某些情况下，我需要按以下方式使用它：

{{#> section title="title1" class="class1" }}
  {{#> section title="title2" }}
     <!-- content -->
  {{/ section }}
{{/ section }}

问题在于，“ title2”部分也将具有“ class1”，从而导致此问题：

<div class="class1">
  <h3>title1</h3>
  <div class="class1">
     <h3>title2</h3>
     <!-- content -->
  </div>
</div>

问题是：有一种避免这种情况的方法，而无需创建第二个部分，例如“ section_class1”

Answer 1

由于您是直接在模板中设置局部数据参数（例如title="title1"），因此防止嵌套部分的局部继承其父级class的最简单方法是为声明嵌套部分的class参数显式设置一个空值：

{{#> section title="title1" class="class1" }}
  {{#> section title="title2" class="" }}
     <!-- content -->
  {{/ section }}
{{/ section }}

我创建了一个fiddle供参考。

一种更健壮且可扩展的方法可能是在数据结构中表示部分并将其传递给模板。例如，您可以定义一个带有子部分数组的根部分，例如：

{
    class: 'class1',
    title: 'First Section',
    sections: [
        {
            class: '',
            title: 'Subsection One'
        },
        {
            class: 'class1',
            title: 'Subsection Two'
        }
    ]
};

这使您可以进行精细控制，以将特定的类应用于每个子节。

您的模板随后需要使用sections遍历子#each数组：

{{#> section }}
    {{#each sections }}
        {{#> section this }}
            <!-- content -->
        {{/ section }}
    {{/each}}
{{/ section }}

我创建了一个fiddle来演示这种选择。

避免将变量应用于嵌套的把手局部块

1 个答案: