【Bootstrap】Rails의 each 메소드로 꺼내는 횟수에 제한을 걸리는 이야기 ~view에서 사용할 수 있었다~

6021 단어 Bootstrap루비Rails

해결하고 싶은 것



Carousel에서 view 파일의 작성이 완료되고, 여기에는 신규 투고를 새로운 것부터 차례로 표시해 가기로 했습니다.
each 메소드로 할 수 있을 것 같다~라고 생각했습니다만, 디폴트에서는 표시할 수 있는 영역이 3개가 되어 있습니다.

※아래 이미지, Heading 부분입니다


DB에 들어 있는 데이터가 4개 이상이 되었을 경우, 자동으로 2단째 이후가 형성되어 버리므로, each 메소드로 꺼내는 수에 제한을 걸어 3개까지 억제하는 방법을 찾았습니다 .

원래 소스 코드 (Heading 부분



<div class="row">
 <div class="col-lg-4">
  <svg class="bd-placeholder-img rounded-circle" width="140" height="140" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: 140x140"><title>Placeholder</title><rect width="100%" height="100%" fill="#777"/><text x="50%" y="50%" fill="#777" dy=".3em">140x140</text></svg>
  <h2>Heading</h2>
  <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
  <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div>

〜以下同じものがあと2つ繰り返し〜


변경한 것



<div class="row">
  <% @item.first(3).each do |item| %>    ⬅️追加したコード
    <div class="col-lg-4">
      <%= image_tag item.image, width: '360', height: '280' %>
      <h1><%= item.hoge %></h1>
      名前
      <h4><%= item.hogehoge %></h4>
      紹介
      <h4><%= item.huga %></h4>
      <button type="button" class="btn btn-outline-secondary rounded-pill"><%= link_to "詳細を見る" %></button>
    </div>
  <% end %>
</div>

<% @item.first(3).each do |item| %>라고 하는 것으로 each 메소드로 배열로부터 꺼낼 횟수를 지정했습니다.
이번 케이스라면 3곳이므로 (3) 입니다.
DRY 정신에 따라 같은 부분을 2곳 삭제할 수 있어 외형도 상당히 깨끗이 했습니다.

이번 일로 자신의 상상할 수 있는 범위는 거의 가능하지 않을까? 라고 생각했습니다.
프로그래밍은 대단한 기술의 집대성이군요.
선인들의 지혜에 감사합니다.
우선은 여러가지 방법으로 검색해 찾아, 찾아낸 것을 트라이해 보는 것이 중요하다고 실감했습니다.

도움이되었습니다.



Ruby each 루프의 횟수 지정

고마워요.

좋은 웹페이지 즐겨찾기