我正在创建一个 Rails 项目，但遇到了几个问题。
application.html.erb首先，我使用布局文件中的 cdn 链接将引导程序添加到项目中。这给了我所需的格式并且工作正常，但是由于涡轮链接，下拉导航所需的 javascript 在页面更改时停止工作。
为了解决这个问题，我使用了 Webpacker 并按照此处的教程https://www.bootrails.com/blog/rails-bootstrap-tutorial/来获取引导程序和所需的 JavaScript 所需的按预期工作。
现在我已经在引导程序中添加了一些用于销毁记录的接收器不再起作用。
下面的代码不再像以前那样显示弹出窗口并销毁记录，而是将我带到记录并显示它。
<%= link_to 'Destroy', emergency_contact, method: :delete, data: { confirm: 'Are you sure?' } %>
当我单击上面的链接时，rails 服务器控制台中会输出以下内容。
Started GET "/emergency_contacts/1" for 127.0.0.1 at 2022-06-15 11:01:48 +0100
Processing by EmergencyContactsController#show as HTML
Parameters: {"id"=>"1"}
EmergencyContact Load (0.1ms) SELECT "emergency_contacts".* FROM "emergency_contacts" WHERE "emergency_contacts"."id" = ? LIMIT ? [["id", 1], ["LIMIT", 1]]
↳ app/controllers/emergency_contacts_controller.rb:63:in `set_emergency_contact'
Rendering layout layouts/application.html.erb
Rendering emergency_contacts/show.html.erb within layouts/application
Rendered emergency_contacts/show.html.erb within layouts/application (Duration: 0.3ms | Allocations: 128)
[Webpacker] Everything's up-to-date. Nothing to do
User Load (0.1ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC LIMIT ? [["id", 1], ["LIMIT", 1]]
↳ app/views/layouts/application.html.erb:45
Rendered layout layouts/application.html.erb (Duration: 7.6ms | Allocations: 3648)
Completed 200 OK in 10ms (Views: 7.9ms | ActiveRecord: 0.3ms | Allocations: 4591)
我已经包含了一些我认为与我面临的问题相关的代码
改为source_path: app/javascript_source_path: app/frontend
内容：
@import "~bootstrap/scss/bootstrap";
内容：
import '../js/bootstrap_js_files.js'
内容：
// import 'bootstrap/js/src/alert'
// import 'bootstrap/js/src/button'
// import 'bootstrap/js/src/carousel'
import 'bootstrap/js/src/collapse'
import 'bootstrap/js/src/dropdown'
// import 'bootstrap/js/src/modal'
// import 'bootstrap/js/src/popover'
import 'bootstrap/js/src/scrollspy'
// import 'bootstrap/js/src/tab'
// import 'bootstrap/js/src/toast'
// import 'bootstrap/js/src/tooltip'
头：
<head>
<title>MyApp</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<!-- Warning !! ensure that "stylesheet_pack_tag" is used, line below -->
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
落下：
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
dd links
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">dd link 1</a></li>
<li><a class="dropdown-item" href="#">dd link 2</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">dd link 3</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">dd link 4</a></li>
</ul>
</li>
替换link_to为button_to
<%= link_to 'Destroy', emergency_contact, method: :delete, data: { confirm: 'Are you sure?' } %>
至：
<%= button_to 'Destroy', emergency_contact, method: :delete, data: { confirm: 'Are you sure?' } %>
如果confirm仍然无法正常工作，您可以添加onclick选项
<%= button_to 'Destroy', emergency_contact, method: :delete, onclick: "return confirm('Are you
sure?')" %>
更新：
用于link_to使用选项method: :delete并data: { confirm: 'Are you sure?' }负责此 gem jquery-ujs和在以前的 Rails 版本中它包含在assets/javascripts/application.js文件中
//= require jquery
//= require jquery_ujs
由于您正在使用javascript_pack_tagwithWebpacker并且您的入口点javascript/packs/application.js不是assets/javascripts/application.js为了使其正常工作，您需要在文件中安装yarn add jquery-ujs和导入它javascript/packs/application.js
import { } from "jquery-ujs"
之后，您将能够使用link_towithdata: { confirm: 'Are you sure?' }和method: :delete
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句