pugのif文で外枠だけ分岐して内容は共通にしたい

前提・実現したいこと

pugのif文はよく使うのですが、たとえば囲っているdivのクラスだけ変えたくて、内容は共通にしたいんだよなということがよくあったので、そもそもできるのかどうかをお聞きしたいです。

該当のソースコード

pug
1- var lunch = "うどん"
2if ( lunch == "うどん" )
3　div(class="lunch udon")　　　   //分岐で変えたい
4　　p 満腹です　　　　　　　 　　　 //分岐で変えたい
5　　p 会社周辺のうまいもんマップは  //共通にしたい
6　　　a(href="hoge.html") こちら //共通にしたい
7else
8　div(class="lunch soba")　　　　//分岐で変えたい
9　　p 腹八分目　　　　　　　　　　 //分岐で変えたい
10　　p 会社周辺のうまいもんマップは //共通にしたい
11　　　a(href="hoge.html") こちら //共通にしたい

試したこと

共通コンテンツ（↑でいうところのうまいもんマップ）を外に出して、分岐内でincludeすれば望み通りの動きにはなります。しかし、軽いコンテンツの分岐であった場合、毎回別のところに置いて管理するのはちょっと面倒だなと思っていたので、ソースの流れの中でできたらいいな、と思い質問いたしました。

行動規範の内容に同意します

回答1件

囲ってるdivもif（三項演算子）を使えば解決するのではないですかね。

例

- var menu = "うどん"
  div(class=`lunch ${menu === "うどん" ? 'udon' : 'soba'}`)
    if ( menu === "うどん" )
      p 満腹です
    else
      p 腹八分目
    p 会社周辺のうまいもんマップは
     a(href="hoge.html") こちら

投稿2022/08/09 12:02