Rails 6-在某些控制器操作中需要JS文件

Question

我目前正在尝试Rails 6.0.0，它似乎将默认的javascript文件夹从app/assets/javascript移动到app/javascript。application.js文件现在位于app/javascript/packs中。

现在，我想为每个控制器操作添加JS文件。例如，我有：

• UsersController#index
• UsersController#show
• UsersController#edit

对于某些控制器操作，我需要添加一些javascript：

• app/javascript/user/index.js
• app/javascript/user/show.js
• app/javascript/user/edit.js
• app/javascript/user/form.js (假设在表单中我需要一些js调整)

以下是我目前正在做的事情。在控制器视图中：

<%= javascript_pack_tag 'user/index', 'data-turbolinks-track': 'reload' %>

但是，在index.js中，我不能调用application.js所需的库。例如，在application.js中：

require("bootstrap/dist/js/bootstrap")

在index.js中，我将引导特定的JS称为popover，模式.我得到了：

Uncaught TypeError: $(...).modal is not a function

我不想用application.js写所有的JS，因为每个页面都要加载整个网站JS，这是个疯子！所以我想把它们分开，包括在我需要的时候。

此外，我们为什么要在application.js中要求JS文件？如果我们使用javascript_pack_tag，我们需要在application.js中要求那些文件吗？

这是我刚创建的虚拟的回购。

Ref：这里解释了如何要求自定义JS文件。

Answer 1

添加到您的application.html.erb

<%= javascript_pack_tag controller_name %> for controllers <br/>
<%= javascript_pack_tag action_name %> for actions

Answer 2

您可以创建一个文件夹结构作为视图。因此，假设您要在用户的编辑视图中添加一些自定义表单验证。您有以下结构：app/views/users/edit.html.erb

在edit.html.erb中，删除所有JS代码并删除脚本标记。代之以添加：

<%= javascript_pack_tag('user/edit') %>

打开app/javascript/packs文件夹。创建与编辑视图相同的文件夹结构，如：app/javascript/packs/product/edit.js。

内部edit.js

window.onload = function () {
  // Your custom form validation JS code for users/edit
}

打开config/application.rb，在模块中：

config.assets.precompile += ['user/edit.js']
# Keep appending more assets as you wish.