menu-local-task.html.twigテンプレートの各要素にクラスを追加するにはどうすればよいですか？

Question

ラッパーとクラスを追加して、管理タブテンプレートを変更する必要があります。

これはデフォルトのコードです：

<li{{ attributes.addClass(is_active ? 'is-active') }}>{{ link }}</li>

私のコード：

<div {{ .attributes.addClass(is_active ? 'DefTabs__tabItem--active') }}>{{ link }}</div>

現在、「DefTabs__tabItem--active」クラスがアクティブリンクに追加されていますが、各DIV要素にCSSクラス「DefTabs__tabItem」を追加する必要があります。これどうやってするの？

Answer 1

配列を作成します。例：

{%
    set classes = [   
      is_active ? 'is-active',
      'my-second-class-name',
    ]
%}

<div {{ attributes.addClass(classes) }}>{{ link }}</div>

---

現在、「DefTabs__tabItem--active」クラスがアクティブリンクに追加されていますが、各DIV要素にCSSクラス「DefTabs__tabItem」を追加する必要があります。

ちなみに、名前を繰り返す必要はありません。次のようにします。

{%
    set classes = [   
      'DefTabs__tabItem',
      is_active ? 'active',
    ]
%}

<div {{ attributes.addClass(classes) }}>{{ link }}</div>

次に、CSSでアクティブをターゲットにできます .DefTabs__tabItem.active { ... }