在rails中为不同视图使用不同的样式

Question

Rails 5.1

我主要处理后端问题，但我正在尝试更多地了解前端内容，我对Rails中的样式处理方式感到有些困惑（我在stackolverflow上阅读了一堆答案，但是没有帮助我缩小范围。）

我有两种不同的观点

views/user/login.html.slim
views/user/new.html.slim

我想为每个视图应用不同的体型。生成应用程序后，Rails添加了：

assets/stylesheets/users.css.scss

我是否需要添加一个名为users的文件夹，并且里面有不同的样式表？像这样的东西：

assets/stylesheets/users/login.css.scss

会有：

body {
  padding-top: 40px;
}

和

assets/stylesheets/users/new.css.scss

会有：

body {
  padding-top: 80px;
}

然后，在

stylesheets/application.css.scss

我想补充一下：

*= require_self
*= require_tree .

Answer 1

样式和javascripts从您的布局中加载。开箱即用它看起来像这样： app/views/layouts/application.html.erb

<%= stylesheet_link_tag    'application', media: 'all' %>
<%= javascript_include_tag 'application' %>

如果您只想在特定视图中包含特定的css文件，则需要：

• 为您的特定视图创建布局。
• 在布局中包含适当的样式和javascripts。
• 指定控制器中的特定布局。

以下是有关layouts的更多信息，但让我们通过它来查看您的登录示例。

app/controllers/sessions/create

class SessionsController < ApplicationController
   layout 'login', only: [:new]
   # you could also call the layout "sessions.html.erb" and it will be 
   # loaded automagically

如果要对同一控制器中的不同操作使用不同的布局，可以添加其他布局方法，并使用only操作指定它们应用的操作。

然后是布局

app/views/layouts/login.html.erb

...
<%= stylesheet_link_tag 'login', media: 'all' %>
...

最后你的样式表

app/assets/stylesheets/login.scss

@import "file_you_want";

如果你require_tree .它将加载样式表目录中的所有样式，我认为这不是你想要的。