Thành Thạo Flash Messages Trong Rails: Hướng Dẫn Hoàn Chỉnh

Flash message là gì?

Flash message là cách giao tiếp thông tin với người dùng ứng dụng Rails của bạn để họ biết gì xảy ra kết quả của hành động của họ.

Ví dụ thông báo:

• „Mật khẩu đã thay đổi đúng“ (xác nhận)
• „Không tìm thấy người dùng“ (lỗi)

Bạn đặt flash message này trong controller, sau đó render chúng trong view. Người dùng có thể hành động tương ứng.

Hãy học chính xác cách này hoạt động!

Cách Dùng Flash Messages

Bạn có thể làm việc với các thông báo này dùng phương thức helper flash.

Nó hoạt động rất giống hash Ruby.

Đối tượng flash có phương thức như keys, any? hoặc each & bạn có thể truy cập thông báo cụ thể với [].

Loại flash message nào bạn có thể đặt?

Mặc định bạn có:

• notice
• alert

Ví dụ cách dùng:

flash.alert = "User not found."

Hoặc nếu bạn thích:

flash[:alert] = "User not found."

(Chỉ khác biệt về phong cách.)

Bạn có thể dùng code này bên trong action controller, như index, create, new, v.v.

Cách khác là này:

redirect_to :books_path, notice: "Book not found"

Điều này cho phép bạn redirect & tạo flash message trong một bước.

Hay!

Alert vs Notice

Theo hiểu của tôi không thực sự quan trọng bạn dùng alert hay notice.

Dùng cái cảm thấy tự nhiên hơn cho tình huống của bạn.

Tôi thích coi alert như thông báo lỗi & notice như thông báo xác nhận.

Tách riêng giúp bạn style chúng khác nhau.

Ví dụ:

Bạn có thể hiển thị alert màu đỏ & notice màu xanh.

Cũng có thể tạo loại flash tùy chỉnh bằng phương thức controller add_flash_types.

Như sau:

class ApplicationController
add_flash_types :info, :error, :warning
end

Tôi thích giữ đơn giản, nên tôi dùng loại tích hợp sẵn 🙂

Render Flash Messages

Flash message không hiển thị tự động.

Bạn phải render chúng bên trong một view để người dùng thấy.

Xem xét thêm cái này vào application layout.

Ví dụ code:

<% flash.each do |type, msg| %>
<%= msg %>
<% end %>

Đặt ở đâu bạn muốn hiển thị notice, thường ở đầu trang, dưới thanh menu.

Nhớ:

Một khi bạn render thông báo, nó sẽ bị xóa khỏi flash, nên nó sẽ không hiển thị lại.

Tạo Kiểu Cho Notice & Alert Messages

Flash message không có thiết kế hoặc style tích hợp sẵn.

Giải pháp?

Nếu bạn dùng Bootstrap, bạn có thể dùng class CSS "alert alert-info" để flash message trông đẹp.

Ví dụ:

<% flash.each do |type, msg| %>
<%= msg %>
<% end %>

Trông như thế này:

Nếu bạn KHÔNG dùng Bootstrap, bạn có thể tự viết CSS để làm cho nó trông như bạn muốn.

Flash Messages Được Render Khi Nào?

Flash message chỉ bị xóa ở action controller tiếp theo, sau khi bạn hiển thị chúng.

Hàm ý:

• Nếu bạn redirect_to, sau đó render flash message, đó là tốt
• Nếu bạn redirect_to & KHÔNG render thông báo, thông báo sẽ ở lại, trong hash flash
• Nếu bạn render trên cùng action bạn đang đặt flash message, flash message đó sẽ có sẵn, nhưng KHÔNG bị xóa nên nó sẽ ở lại & có thể hiển thị hai lần

Vậy…

Làm sao nếu bạn muốn đặt flash message cho action hiện tại?

Đó là nơi flash.now xuất hiện!

Ví dụ:

def index
@books = Book.all
flash.now[:notice] = "We have exactly #{@books.size} books available."
end

Điều này sẽ render view index.

Thông báo notice sẽ hiển thị & bị xóa khỏi flash nên nó không hiển thị hai lần.

Nói cách khác:

Bạn chỉ cần dùng flash.now nếu bạn định render thay vì redirect.

Tóm Tắt

Bạn đã học về flash message trong Rails & cách dùng chúng đúng cách!

Btw, flash message không giống validation error. Validation liên kết với đối tượng model, và bạn truy cập thông báo validation với phương thức errors, như @user.errors.

Bây giờ đến lượt bạn đưa vào thực hành bằng cách viết code.

Cảm ơn bạn đã đọc!