cách sử dụng một mẫu cành cây khác nhau tùy thuộc vào điểm dừng

Làm cách nào để có cách sử dụng các mẫu twig khác nhau tùy thuộc vào chế độ xem hoặc có biến twig cung cấp thông tin?

Một ví dụ là sử dụng các lớp dính nền tảng trên các mẫu twigh. Độ dính đang làm lộn xộn trên chế độ xem trên thiết bị di động

 <div id="sidebar-first" {{ create_attribute({'class': sidebar_first_classes }) }} data-sticky-container>
              <div class="sticky" data-sticky data-top-anchor="sidebar-first:top" data-btm-anchor="main:bottom">
                {{ page.sidebar_first }}

Tôi đã phải loại bỏ các lớp bằng cách nào đó bằng cách sử dụng JS:

 chức năng tiết lộSidebar() {
    thanh bên const: HTMLElement | null = document.querySelector('.sidebar-first');
    const cố định: HTMLElement | null = document.querySelector('.sticky');
    nếu (thanh bên != null) {
      // Độ dính ne doit pas être opérante sur mobile
      if (dính != null) {
        trong khi (sticky.attributes.length > 0) sticky.removeAttribute(sticky.attributes[0].name);
        dính.classList.remove('dính');
      }
      sidebar.style.display = 'khối';
      sidebar.style.height = '320px';
      sidebar.classList.remove('sticky-container');
    }
    const Reveal = document.querySelector('.reveal-button') as HTMLElement;
    Reveal.style.display = 'không';
  }