在Ruby on Rails中集成JavaScript和Stimulus

發(fā)布時間：2024-04-19 14:45:23 來源：億速云閱讀：74 作者：小樊欄目：編程語言

要在Ruby on Rails中集成JavaScript和Stimulus，您可以遵循以下步驟：

gem 'stimulus-rails'

然后運行bundle install來安裝gem。

引入Stimulus：在應(yīng)用程序的JavaScript文件中引入Stimulus。您可以在app/javascript/packs/application.js文件中添加以下代碼：

require("stimulus")

創(chuàng)建控制器：創(chuàng)建一個Stimulus控制器來處理JavaScript邏輯。您可以在app/javascript/controllers目錄下創(chuàng)建一個新的JavaScript文件，例如hello_controller.js，并添加以下內(nèi)容：

import { Controller } from "stimulus"

export default class extends Controller {
  connect() {
    console.log("Hello, Stimulus!")
  }
}

在視圖中使用控制器：在視圖文件中使用Stimulus控制器。例如，在app/views/pages/index.html.erb文件中，您可以添加以下代碼：

<div data-controller="hello">
  <button data-action="click->hello#connect">Say hello</button>
</div>

這將在頁面上創(chuàng)建一個按鈕，并且當(dāng)按鈕被點擊時，控制器中的connect方法將被調(diào)用。

運行應(yīng)用程序：運行您的Rails應(yīng)用程序并訪問包含Stimulus控制器的頁面。您應(yīng)該能夠看到控制臺中打印出"Hello, Stimulus!"。

通過以上步驟，您就可以在Ruby on Rails中成功集成JavaScript和Stimulus，并使用Stimulus控制器來處理頁面中的交互邏輯。

向AI問一下細(xì)節(jié)

猜你喜歡