【Rails】onclick属性を指定してもJSの関数が使えない

やりたいこと

ビューファイルに直接書いたJavaScriptをapp/javascript/packs/application.jsファイルに移行したい。

app/views/**s/**.html.slim

javascript:
  function hoge(target) {
    〜処理〜
  }

input type="button" value="hoge" onclick="hoge(this)"

上手くいかない

JavaScript部分をそのまま切り取ってapp/javascript/packs/application.jsファイルに移行すると今まで動いていたのに、動かなくなってしまう。

teratailで解決法を発見

記述したjavascriptが関数でラッピングされてる可能性があるので、HTML側から呼び出せないのかもしれません。
関数をonclickで呼び出したいならglobal領域に突っ込んであげると上手くいくかもしれません。

とのこと。

解決

以下のように書いてあげるとビューファイルに直接書いたときと同じ動きをしてくれる。

app/javascript/packs/application.js

window.hoge = function (target) {
  〜処理〜
}

参考

• 【teratail】Rails6 onclickでJSの関数がなぜ呼び出せないのかがわかりません