futureshopでログイン状態の条件分岐

  • 2023年3月29日
  • 2023年3月29日
  • futureshop
  • View
  • 0件

条件分岐のコード

<div class="gnav fs-clientInfo">
  <ul class="function loggedIn--{@ member.logged_in @}">
    <li class="item login login-false">
      <a href="/p/login">
        <figure class="icon"><img src="https://lieto.itembox.design/item/assets/img/common/icon-login.svg" alt="ログイン"></figure>
        <span class="caption">ログイン</span>
      </a>
    </li>
    <li class="item register login-false">
      <a href="/p/register">
        <figure class="icon"><img src="https://lieto.itembox.design/item/assets/img/common/icon-pen.svg" alt="新規会員登録"></figure>
        <span class="caption">新規会員登録</span>
      </a>
    </li>
    <li class="item mypage login-true">
      <a href="/my/top">
        <figure class="icon"><img src="https://lieto.itembox.design/item/assets/img/common/icon-mypage.svg" alt="マイページ"></figure>
        <span class="caption">マイページ</span>
      </a>
    </li>
    <li class="item logout login-true">
      <a href="/p/logout">
        <figure class="icon"><img src="https://lieto.itembox.design/item/assets/img/common/icon-logout.svg" alt="ログアウト"></figure>
        <span class="caption">ログアウト</span>
      </a>
    </li>
  </ul>
</div>

fs-clientInfo」というクラスを付与する。

その付与されたタグ内のタグのクラスに「{@ member.logged_in @}」を付与することで、ログイン状態派の場合はtrueを、未ログイン状態の場合はfalseを返す。

■参考サイト
ログイン/ログアウトの切り替えリンクを付けるにはどうすればいいですか?