没有通知时如何从通知栏删除“ 0”-收到通知时如何删除样式

Question

我正在为Rails应用程序构建一个通知系统。该方法有效，更新表等，一切正常。现在，当没有未读的通知时，我不想显示0。并且当有通知时，我希望能够设置样式（就像这里的绿色矩形一样）。

notifcation.json.coffee：

class Notifications
  constructor: ->
    @notifications = $("[data-behavior='notifications']")


    if @notifications.length > 0
      @handleSuccess @notifications.data("notifications")
      $("[data-behavior='notifications-link']").on "click", @handleClick

      setInterval (=>
        @getNewNotifications()
      ), 50000

  getNewNotifications: ->
    $.ajax(
      url: "/notifications.json"
      dataType: "JSON"
      method: "GET"
      success: @handleSuccess
    )

  handleClick: (e) =>
    $.ajax(
      url: "en/notifications/mark_as_read"
      dataType: "JSON"
      method: "POST"
      success: ->
        $("[data-behavior='unread-count']").text(0)
    )

  handleSuccess: (data) =>
    items = $.map data, (notification) ->
      notification.template

    unread_count = 0
    $.each data, (i, notification) ->
      if notification.unread
        unread_count += 1

    $("[data-behavior='unread-count']").text(unread_count)
    $("[data-behavior='notification-items']").html(items)



jQuery ->
  new Notifications

我认为我有以下内容：

<li class="nav-item btn-group" data-behavior="notifications" data-notifications='<%= render template: "notifications/index", formats: [:json] %>'>
  <div class="dropdown-toggle nav-link" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-behavior="notifications-link">
    <span data-behavior="unread-count" class="fas fa-bell"></span>
  </div>
  <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton" data-behavior="notification-items">
  </div>
</li>

当前看起来像这样：

Answer 1

0来自handleClick的这一行，只需替换为您想要的任何文本即可：

$("[data-behavior='unread-count']").text("")

然后更新：

unread_count = 0
$.each data, (i, notification) ->
  if notification.unread
    unread_count += 1
if(unread_count == 0) unread_count = ""
$("[data-behavior='unread-count']").text(unread_count)