Question

我正在使用acts_as_votable gem为我的帖子添加Like按钮。我按照以下StackOverflow问题中的说明进行操作：

代码工作得很好，但我宁愿使用图像而不是文本链接。基本上我正在尝试使用现有的设计模板，该模板使用基于喜欢或不喜欢的以下代码：

像

<span class="heart-icon" style="background-position: 0px -290px;" id="<%= @pride.id %>"></span>

不喜欢

<span class="heart-icon" style="background-position: 0px -256px;" data-id="<%= @pride.id %>"></span>

我尝试在 link_to 上使用执行并且它可以正常工作，但也会应用我认为来自JS文件的文本叠加层。我在这里搜索了很多问题，但我似乎无法找到适合我情况的问题。我希望社区中的某个人能够帮助我。

以下是我目前的设置方法：

我的观点如下：

<% if current_user.liked? @content %>
 <%= link_to "Dislike", dislike_content_path(@content), class: 'vote', method: :put, remote: true, data: { toggle_text: 'Like', toggle_href: like_content_path(@content), id: @content.id } %>
<% else %>
 <%= link_to "Like", like_content_path(@content), class: 'vote', method: :put, remote: true, data: { toggle_text: 'Dislike', toggle_href: dislike_content_path(@content), id: @content.id } %>
<% end %>

我的CoffeeScript看起来像这样：

$(document).on 'ajax:success', 'a.vote', (status,data,xhr)->
# update counter
$(".votes-count[data-id=#{data.id}]").text data.count

# toggle links
$("a.vote[data-id=#{data.id}]").each ->
  $a = $(this)
  href = $a.attr 'href'
  text = $a.text()
  $a.text($a.data('toggle-text')).attr 'href', $a.data('toggle-href')
  $a.data('toggle-text', text).data 'toggle-href', href
  return

return

这就是我希望我的视图配置的方式，但它一直在图像上写下喜欢/不喜欢的文字，我无法弄清楚在哪里更改它。

<% if current_user.liked? @content %>
    <%= link_to "Dislike", dislike_content_path(@content), class: 'vote', method: :put, remote: true, data: { toggle_text: 'Like', toggle_href: like_content_path(@content), id: @content.id } do %>
        <span class="heart-icon" style="background-position: 0px -290px;" id="<%= @content.id %>"></span>
    <% end %>
<% else %>
    <%= link_to "Like", like_content_path(@content), class: 'vote', method: :put, remote: true, data: { toggle_text: 'Dislike', toggle_href: dislike_content_path(@content), id: @content.id } do %>
        <span class="heart-icon" style="background-position: 0px -256px;" data-id="<%= @content.id %>"></span>
    <% end %>
<% end %>

Answer 1

我在GitHub上发现了这个非常棒的存储库帮助了我。特别感谢作者。

https://github.com/shihabullal/soquestion6482354

Ruby on Rails像按钮，图像没有文字

1 个答案: