빵 부스러기 목록의 실현

7200 단어 Ruby

gretel의 사용 방법


나는 한 EC 사이트의 복사본을 제작할 때 빵 부스러기 목록을 실시했다.
몇 개의gem가 있지만, 컨트롤러를 사용하지 않고 설정 파일과 보기에서만 설명할 수 있는gretel을 선택했습니다.
그리고 이름이 너무 귀여워요.

빵 찌꺼기 목록


아래 그림을 보십시오.

웹사이트에서 자주 보는 물건이네요!
이번에는 이걸 실시할 겁니다.

① gretel의 가져오기


GitHub
https://github.com/lassebunk/gretel
공식.
https://www.rubydoc.info/gems/gretel

② gem의 설치

gem "gretel"
$ bundle install

③ 파일 설정


다음 명령을 사용하여 프로필 만들기
$ rails generate gretel:install
다음 파일을 생성합니다.
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`).
우선 저는 제 페이지를 빵 찌꺼기 명세서에 쓰고 싶어서 다음과 같이 보충합니다.
config/breadcrumbs.rb
# ルート
crumb :root do
  link "トップページ", root_path
end

# マイページ
crumb :mypage do
  link "マイページ", mypage_users_path
end
・: mypage← 호출 설정 파일.
・"내 페이지"← 빵 찌꺼기 목록에 표시된 이름.
・mypageusers_path← 호출 원본의 경로를 지정합니다.

④ 뷰 설정


mypage.html.haml
-# config/breadcrumbs.rbに定義したmypageを呼び出し
- breadcrumb :mypage
-# 下記を記述した箇所にパンくずリストが表示される。
= breadcrumbs pretext: "You are here:",separator: " › "
・pretext ← 빵 부스러기 목록의 첫머리를 삽입한 글을 기술합니다.필요 없으면 설정 안 해도 돼.
・separator ← 빵 부스러기의 구분자를 지정합니다.'&rsaquo' 를 출력하면 'exy' 가 됩니다.
빵 부스러기 목록의 표시는 일반적으로 모든 페이지에 표시할 수 있다.html.나는 많은 것들이haml에 기록되어 있다고 생각한다. 이번에는 일부 페이지에만 표시하고 수정하기 편리하도록 아래의 부분에 따라 템플릿화했다.
layouts/_breadcrumbs.html.haml
.breadcrumbs
  = breadcrumbs pretext: "",separator: " › ", class: "breadcrumbs-list"
실제 목록 호출과 표시 결과는 이렇다.
mypage.html.haml
- breadcrumb :mypage
= render "layouts/breadcrumbs"

⑤부모의 설정


config/breadcrumb.rb의crumb와end 사이에parent를 설정하여 부모를 설정할 수 있습니다.
자신의 페이지를 부모님께 설정해서 목록에 개인 프로필을 보여 드리세요.
config/breadcrumbs.rb
# ルート
crumb :root do
  link "トップページ", root_path
end

# マイページ
crumb :mypage do
  link "マイページ", mypage_users_path
end

# プロフィール
crumb :profile do
  link "プロフィール", edit_user_path
  parent :mypage
end
다음과 같이 표시됩니다.

이번 참고 기사.
https://qiita.com/you8/items/d2d37a745060b79c112f
https://qiita.com/namitop/items/5bcb3b90e63af758a9b0
http://vdeep.net/rubyonrails-gretel
https://doruby.jp/users/kisuzuki/entries/gretel%E3%81%A7%E3%83%91%E3%83%B3%E3%81%8F%E3%81%9A%E3%83%AA%E3%82%B9%E3%83%88%E3%82%92%E4%BD%9C%E6%88%90
이상은gretel의 빵 부스러기 목록을 사용한 실현입니다.

좋은 웹페이지 즐겨찾기