[RUBY] [Schienen] Mehrstufige Kategorien in der Ausschussliste anzeigen

Überblick

Zeigen Sie die von Vorfahren erstellte mehrstufige Kategorie in der Brotkrumenliste an. Ich habe einen Edelstein namens Gretel verwendet, um die Brotkrumenliste zu erstellen. Dieses Mal erstellen wir eine Brotkrumenliste, in der die Produktkategorien auf der EC-Website angezeigt werden. パンくず カテゴリ.png

Annahme

Die diesmal erläuterte Struktur der Brotschrottliste ist wie folgt. Startseite> Kategorieliste> Elternkategorie> Kinderkategorie> Enkelkategorie

Referenzartikel

Wir verwenden einen Edelstein namens Abstammung, um mehrstufige Kategorien zu erstellen. Die folgenden Artikel sind hilfreich für die Einführungsmethode. https://qiita.com/Sotq_17/items/120256209993fb05ebac https://qiita.com/pdm21/items/fe0055b3190af790f1c0

In Bezug auf die Erstellung der Produktlistenseite nach Kategorien möchte ich Sie auch bitten, auf meine früheren Beiträge zu verweisen. https://qiita.com/Iwa_tech/items/8c396723bd9ea8e9894f

Implementierung

Einführung

Edelsteininstallation

Installieren Sie zuerst gretel.

# Gemfile
gem 'gretel'

#Terminal
$ bundle install

Generierung der Konfigurationsdatei

Geben Sie Folgendes in das Terminal ein und führen Sie es aus.

$ rails generate gretel:install

Anschließend wird im Konfigurationsverzeichnis automatisch eine Datei mit dem Namenreadcrumbs.rb generiert. In dieser Datei beschreiben Sie die Einstellungen, für die Brotabfälle auf welche Seite verlinkt werden sollen.

config/breadcrumbs.rb


crumb :root do
  link "Home", root_path
end

# crumb :projects do
#   link "Projects", projects_path
# end

# crumb :project do |project|
#   link project.name, project_path(project)
#   parent :projects
# end

# crumb :project_issues do |project|
#   link "Issues", project_issues_path(project)
#   parent :project, project
# end

# crumb :issue do |issue|
#   link issue.title, issue_path(issue)
#   parent :project_issues, issue.project
# end

# If you want to split your breadcrumbs configuration over multiple files, you
# can create a folder named `config/breadcrumbs` and put your configuration
# files there. All *.rb files (e.g. `frontend.rb` or `products.rb`) in that
# folder are loaded and reloaded automatically when you change them, just like
# this file (`config/breadcrumbs.rb`).

Erstellen von Semmelbröseln auf der Kategorielistenseite

Machen Sie es zunächst aus den Brotresten der oberen Seite> Kategorieliste, die einfach implementiert werden können.

Definition von Semmelbröseln

Beschreiben Sie in der Datei bathcrumbs.rb das Verknüpfungsziel der Brotkrumen. Geben Sie die Zeichen, die auf dem Link angezeigt werden sollen, und den Pfad des Linkziels auf dieselbe Weise wie die Methode link_to an.

config/breadcrumbs.rb


crumb :root do
  link "oberste Seite", root_path
end

crumb :category_index do
  link "Kategorieliste", categories_path
end

In Ansicht installiert

Teilweise Vorlagenerstellung

Erstellen Sie eine Teilvorlage für die Brotkrumenliste, damit sie von mehreren Seiten aufgerufen werden kann. Sie können es in layouts / application.html schreiben, aber dieses Mal wollte ich die Anzeige für jede Seite trennen, deshalb habe ich mich für eine Teilvorlage entschieden. Mit dem Trennzeichenattribut können Sie die Anzeige des Trennzeichens zwischen Semmelbröseln definieren.

_breadcrumbs.html.haml


.breadcrumbs
  = breadcrumbs separator: " › ", class: "breadcrumbs-list"

Teilweise Vorlagenaufruf

Rufen Sie in der Ansicht der Kategorielistenseite die Brotschrottliste auf. Die Beschreibung in der ersten Zeile unten gibt die zu rufenden Brotreste an.

app/views/categories/index.html.haml


- breadcrumb :category_index
= render "breadcrumbs"

Zu diesem Zeitpunkt sollten Sie in der Lage sein, die Brotschrottliste auf der Kategorielistenseite anzuzeigen. Übrigens, da die Klasse namens current automatisch den Brotresten der angezeigten Seite zugewiesen wird, können Sie auch CSS verwenden, um den angezeigten Seitennamen wie unten gezeigt hervorzuheben. パンくず1.png

Erstellen von Semmelbröseln auf der Kategoriedetailseite

Zeigen Sie als Nächstes die Brotkrumenliste auf der Produktlistenseite nach Kategorie an. Wie unten gezeigt, möchten wir Brotabfälle jeder Kategorie unter die zuvor hergestellten Brotabfälle einfügen.

Startseite> Kategorieliste> Elternkategorie> Kinderkategorie> Enkelkategorie

Definition von Semmelbröseln

Stellen Sie Brotkrumen für die drei Kategorien Eltern, Kind und Enkel ein. tun in der Definition Teil der Krume|Variablennamen|Auf diese Weise können Sie Variablen in den Krümeln verwenden.

config/breadcrumbs.rb


#Brotkrumen der Elternkategorie
crumb :parent_category do |category|
  category = Category.find(params[:id]).root
  link "#{category.name}", category_path(category)
  parent :category_index
end
# -----------------------------------------------------------------
#Brotkrumen der Kategorie Kind
crumb :child_category do |category|
  category = Category.find(params[:id])
  #Wenn die angezeigte Seite eine Listenseite mit untergeordneten Kategorien ist
  if category.has_children?
    link "#{category.name}", category_path(category)
    parent :parent_category

  #Wenn die angezeigte Seite eine Listenseite mit Enkelkategorien ist
  else
    link "#{category.parent.name}", category_path(category.parent)
    parent :parent_category
  end
end
# -----------------------------------------------------------------
#Brotkrumen der Kategorie Enkelkind
crumb :grandchild_category do |category|
  category = Category.find(params[:id])
  link "#{category.name}", category_path(category)
  parent :child_category
end

Nach übergeordnetem Element: Geben Sie den Krümelnamen an, den Sie als übergeordnetes Element der Krume festlegen möchten. (Wenn Sie nicht wie auf der Kategorielistenseite übergeordnet angeben, sind Stammbrotabfälle die übergeordneten Elemente.)

Nur die Semmelbrösel in der Kategorie Kinder brauchen etwas Einfallsreichtum. Die Verarbeitung wird gemäß zwei Bedingungen geändert: Zum einen werden die Brotreste der untergeordneten Kategorie von der Seite der Enkelkategorie aufgerufen und zum anderen von der Seite der untergeordneten Kategorie.

In Ansicht installiert

Rufen Sie zum Schluss die Semmelbrösel an und Sie sind fertig. In der Beschreibung auf der Controllerseite wird die Kategorie, die im Detail angezeigt werden soll, hier @category zugewiesen. Die anzuzeigenden Brotreste werden gemäß der Hierarchie von @category unterteilt. Wenn der aufrufende Brotschrott auf einen Elternteil festgelegt ist, wird auch der Brotschrott des Elternteils aufgerufen.

app/views/categories/show.html.haml


- if @category.root?
  - breadcrumb :parent_category
- elsif @category.has_children?
  - breadcrumb :child_category
- else
  - breadcrumb :grandchild_category
= render "breadcrumbs"

Mit den oben genannten Informationen kann die Brotkrumenliste auf der Kategoriedetailseite angezeigt werden. Stellen Sie sicher, dass sich die Brotkrumenhierarchie und der Kategoriename je nach ausgewählter Kategorie entsprechend ändern. パンくず2.png

Schließlich

Dieses Mal habe ich erklärt, wie die von Vorfahren erstellte mehrstufige Kategorie in der Brotkrumenliste angezeigt wird. Vielen Dank für Ihren Besuch auf unserer Website.

Dies ist ein Artikel, den ich als Referenz beim Erstellen der Brotkrumenfunktion verwendet habe. https://qiita.com/you8/items/d2d37a745060b79c112f https://qiita.com/Azure0701/items/16de34a0010eb7f05d89

Recommended Posts

[Schienen] Mehrstufige Kategorien in der Ausschussliste anzeigen
[Schienen] Machen Sie eine Brotkrumenliste
Über das Symbol <%%> in Rails erb
Die Identität der Schienenparameter [: id]
Rails Refactoring Geschichte vor Ort gelernt
[Rails] Setzen Sie die Datenbank in der Produktionsumgebung zurück
Rails6: Extrahieren Sie das Bild im Aktionstext
[Bestellmethode] Legen Sie die Reihenfolge der Daten in Rails fest
Ich habe versucht, die Sitzung in Rails zu organisieren
[Rails] Zeigt Avatare in Posts mit Active Storage an
[Rails] Erstellen einer Brotkrumenliste mit Gem gretel
[Rails] ActiveRecord :: HasManyThrough-Bestellfehler in Benutzer # show
So überprüfen Sie Rails-Befehle im Terminal
Group_by in Rails
So stellen Sie die Anzeigezeit in Rails auf japanische Zeit ein
[Ruby / Rails] Legen Sie einen eindeutigen (eindeutigen) Wert in der Klasse fest
Fragen zur Implementierung der Like-Funktion (Ajax) in Rails
SSL in der lokalen Umgebung von Docker / Rails / Puma
[Schienen] So zeigen Sie Bilder in der Ansicht an