Thành Thạo Helper link_to Rails: Hướng Dẫn Toàn Diện Với Ví Dụ

Rails link_to method! Một trong helper method phổ biến nhất bạn dùng trong mọi Rails app. Nhưng nó hoạt động như thế nào? Nếu bạn đến đây học link_to & các option khác nhau thì bạn đúng chỗ!

Trước tiên... link_to làm gì? Toàn bộ web chỉ hoạt động vì có link giữa trang. Đó là cách đi từ trang này sang trang khác. HTML thuần, tạo link:

 Improve Your Ruby Skills

Nhưng Rails trông như:

 <%= link_to "Improve Your Ruby Skills", "/ruby-book" %>

Tại sao? Vì dùng routes trong Rails. Muốn tận dụng bằng dùng method _path & làm target (href) của link. link_to làm dễ dàng vì không phải interpolate giá trị. Điều tôi nói:

 Improve Your Ruby Skills

Bây giờ: Xem sâu option hữu ích nhất method này hỗ trợ.

Options & Arguments Rails link_to

Đối số đầu link_to là text trên link. Đối số hai? Là URL bạn link đến. Hardcode nếu muốn, nhưng đa số dùng Rails model, hoặc method _path. Rails tự xử lý nếu tuân convention. Ví dụ:

 <%= link_to "Improve Your Ruby Skills", book_path(@book) %>

Hoặc: <%= link_to "Improve Your Ruby Skills", @book %>. Làm sao biết dùng cái nào?

Dạng số ít khi refer resource cụ thể (book)
Dạng số nhiều khi refer collection (books)

Ví dụ:

 # Số nhiều
<%= link_to "All Books", books_path %>
# Số ít
<%= link_to "Edit Book", edit_book_path(@book) %>

Cũng giúp xem routes (với rake routes). Cột 1 có tên (như edit_book) dùng trong link bằng thêm _path.

Link Xóa Với Xác Nhận

Hai option hữu ích: confirm, disable_with. Ví dụ:

 <%= link_to "Delete Book", @book, method: "delete", { confirm: "Are you sure?", disable_with: "Processing..." } %>

Default action link là GET request. Muốn dùng action "DELETE" phải cụ thể. Nhưng... Muốn link về trang trước? Thử: <%= link_to "Back", :back %>.

Cách Dùng Custom CSS Class & HTML Attribute

Làm link khác biệt với CSS. Ví dụ:

 <%= link_to "Get More Books", books_path, class: "index-link" %>

Giả sử CSS:

 .index-link { color: blue; padding: 10px; }

Cần thêm HTML attribute (như "id") add sau link text & link URL.

Cách Tạo Query Params & Anchor Links

Option hữu ích khác: tạo link với query parameter & anchor. Tại sao hữu ích? Vì truy cập data thêm từ controller sau user click link. Xem ví dụ! Muốn URL như: "/search?q=all". Làm: <%= link_to "Search ALL", search_path(q: "all") %>. Và URL: "/books#programming". Làm: <%= link_to "Programming Books", books_path(anchor: "programming") %>. Kết hợp URL helper (_path / _url), link_to cho mọi flexibility.

Link Đến Hình Ảnh

Nhiều người không biết link_to nhận block tùy chọn. Cho phép kịch bản phức tạp. Như link đến image:

 <%= link_to books_path do %>
  <%= image_tag "Book Collection" %>
<% end %>

Trong ví dụ này, nội dung block thành link text, image hoặc bất kỳ HTML element nào bạn muốn clickable.

Tóm Tắt

Bạn đã học method link_to trong Rails! Nếu hữu ích, lấy cuốn sách Ruby của tôi để super-charge skill & ủng hộ work. Cảm ơn bạn đã đọc 🙂