ruby 如何在Rails 7视图上使用自定义JS？

i2loujxw 于 2022-12-12 发布在 Ruby

关注(0)|答案(2)|浏览(234)

我正在尝试将自定义JS添加到我的Rails 7项目中。我按照this StackOverflow answer上的说明操作。
但是我仍然不能在我的视图中使用自定义JS。
下面是我的main.js：

function sayHi() {
    console.log("hi");
}

window.sayHi = sayHi;

下面是我的观点（index.html.erb）：

<div>
  <button type="button" onclick="sayHi()">Click Me!</button>
</div>

当我单击该按钮时，控制台中显示：

Uncaught ReferenceError: sayHi is not defined

我真的不知道如何从我的视图访问自定义JS。
Here是我上传到Dropbox的项目的链接。

2条答案

您需要将函数公开给全局范围。

window.sayHi = sayHi;

因此，我将把这篇文章作为一个完整的答案发布给任何想在Rails 7项目中添加javascript的人：
1.在app/javascript/custom/main.js（或任何您喜欢的文件名）中创建您的自定义JS文件：

function sayHi() {
    console.log("hi");
}

window.sayHi = sayHi;  // You must have this to expose your functions

(or可以使用事件处理程序）
1.转到config/importmap.rb并添加以下内容：

pin_all_from "app/javascript/custom", under: "custom"

1.转到app/javascript/application.js文件并添加以下内容：

import "custom/main"

1.在终端中运行：

rails assets:precompile

1.启动Rails服务器。👍