All about layout in Rails
Bài đăng này đã không được cập nhật trong 2 năm
A. Layout là gì:
- Trong Rails, layout là tập tin định nghĩa các đoạn html bao quanh template được render bởi action của các controller.
- Một layout có thể được sử dụng bởi nhiều controller khác nhau.
B. Các loại layout và cách sử dụng:
- Bài viết này sẽ sử dụng UsersController có 2 action là index và new để làm ví dụ về cách sử dụng các layout trong Rails.
1. Application layout:
- Khi khởi tạo rails project, ApplicationController và file layouts/application.html.erb được tạo ra.
- Dòng code <%= yield %> sẽ chỉ định nơi template của action của các controller được render bên trong layout.
<!DOCTYPE html>
<html>
<head>
<title>Layout</title>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track": "reload" %>
<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>
</head>
<body>
<h1>Application Layout</h1>
<%= yield %>
</body>
</html>
- Khi các controller khác thực hiện kế thừa ApplicationController thì cũng kế thừa luôn layout của ApplicationController.
class UsersController < ApplicationController
def index
end
def new
end
end
- Khi đó teamplete được render bởi các action của UsersController sẽ được render bên trong layouts/application.html.erb
2. Controller specific layout:
- Khi một file layout được tạo ra có tên trùng với tên của controller thì tập tin đó sẽ được sử dụng như layout của controller có tên tương ứng thay cho file layouts/application.html.erb.
- Để tạo controller specific layout cho UsersController, ta tạo file layouts/users.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Layout</title>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track": "reload" %>
<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>
</head>
<body>
<h1>Users Layout</h1>
<%= yield %>
</body>
</html>
- Khi đó các template được render bởi các acton của controller UsersController sẽ được render bên trong layouts/users.html.erb
- Nếu muốn sử dụng layout khác thay cho layouts/users.html.erb cho tất cả các action của UsersController, ta có thể sử dụng phương thức layout() và truyền vào tên của layout ta muốn sử dụng.
class UsersController < ApplicationController
layout "application"
def index
end
def new
end
end
- Ta có thể thêm tham số only hoặc except vào hàm layout() để chỉ định các action sử dụng hoặc không sử dụng layout được truyển vào trong hàm.
- Các action không sử dụng layout được truyền vào hàm sẽ sử dụng layout mặc định của UsersController, trong trường hợp này là layouts/users.html.erb
class UsersController < ApplicationController
layout "application", only: :new
def index
end
def new
end
end
3. Dynamic layout:
- Khi gặp trường hợp layout của action có thể thay đổi tùy theo trường hợp, không còn cố định là application layout hoặc controller specific layout, ta có thể dử dụng dynamic layout.
- Ví dụ đối với UserController, khi user là admin thì ta sử dụng layouts/admin.html.erb, khi là user thường thì ta sử dụng layouts/user.html.erb
- Nội dung file layouts/admin.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Layout</title>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track": "reload" %>
<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>
</head>
<body>
<h1>Admin Layout</h1>
<%= yield %>
</body>
</html>
- Khi đó ta sử dụng hàm layout() và truyền vào symboy tên hàm xử lý việc chọn layout.
class UsersController < ApplicationController
layout :dynamic_layout
def index
end
def new
end
private
def dynamic_layout
if true # replace for if current_user.admin?
"admin"
else
"users"
end
end
end
- Kết quả thu được
C. Link project tham khảo:
All rights reserved
