单击时更改 Bulma 按钮的颜色

【问题标题】：Changing a color of a Bulma button when clicked单击时更改 Bulma 按钮的颜色
【发布时间】：2020-05-28 19:28:49
【问题描述】：

我想在 Rails 应用程序中更改 Bulma 按钮的颜色。这些按钮用于过滤搜索页面上的结果。

到目前为止，我做了以下操作，但它不起作用，颜色没有改变：

<%= link_to request.params.merge(category: "9"), class: "button is-rounded", id: "ButtonId" do %>
                                <i class="fas fa-thermometer-full"></i><%= t "services.title" %>
                                <% end %>

<script>
$('#ButtonId').click(function() {
$(this).addClass('has-background-danger');
});
</script>

【问题讨论】：

和？有什么问题，你在问什么？
嗯，它不工作，我不知道为什么颜色不改变
您认为这可能是 turbolinks 问题吗？
添加的类中的 CSS 是否被应用或覆盖？
检查按钮，是否有 id ButtonId （并确保它也是页面上唯一具有此 id 的按钮）

标签： ruby-on-rails bulma

【解决方案1】：

我没有正确为 Fontawesome 充电，以下解决了我的问题：

首先，

  yarn add @fortawesome/fontawesome-free

在 app/javascript/packs/application.js 之后

   import "@fortawesome/fontawesome-free/js/all";

在 app/javascript/css/main.scss 中

 @import '@fortawesome/fontawesome-free';

最后在 app/javascript/packs/application.js 中，我删除了

window.jQuery = $;
window.$ = $;

【讨论】：