Javascript Rails 5 ActionCable使用DIV工作，但不使用UL_Javascript_Jquery_Ruby On Rails_Coffeescript_Actioncable

Javascript Rails 5 ActionCable使用DIV工作，但不使用UL

javascript jquery ruby-on-rails coffeescript

Javascript Rails 5 ActionCable使用DIV工作，但不使用UL,javascript,jquery,ruby-on-rails,coffeescript,actioncable,Javascript,Jquery,Ruby On Rails,Coffeescript,Actioncable,我已经使用Rails 5 ActionCable创建了WebSocket消息传递功能。当我使用DIV作为容器时，它非常有效。但当我把它改为使用UL和LI时；它停止工作了。我似乎无法调试这个；但看起来客户端上没有触发接收：事件。send_消息可以工作…并保存在数据库中，其新消息不会显示在页面上 TL；博士在问题的底部插入一位。更新我已成功诊断出该问题，当我删除（从_message.html.erb partial中）检查当前_用户的行时，它再次起作用message.user==当前_用户-但

我已经使用Rails 5 ActionCable创建了WebSocket消息传递功能。当我使用DIV作为容器时，它非常有效。但当我把它改为使用UL和LI时；它停止工作了。我似乎无法调试这个；但看起来客户端上没有触发

接收：

事件。send_消息可以工作…并保存在数据库中，其新消息不会显示在页面上

TL；博士在问题的底部插入一位。

更新我已成功诊断出该问题，当我删除（从_message.html.erb partial中）检查当前_用户的行时，它再次起作用
message.user==当前_用户
-但为什么？

非常感谢您的帮助。以下是（我认为）所有相关代码：

/app/assets/javascripts/channels/conversations.coffee /app/channels/conversations\u channel.rb

#修改此文件时，请确保重新启动服务器。动作电缆在不支持自动重新加载的环路中运行。
类ConversationsAnnel


/app/jobs/message_broadcast_job.rb
class MessageBroadcastJob

/app/views/conversations/show.html.erb
。。。


...
从2到1000个字符
...

/app/views/messages/_message.html.erb



以前



太长，读不下去了
正如我所说的，以前我使用的是容器div:
，每条消息都在子div中，而不是LI元素中，并且它正在工作。我不知道我损坏了什么（或者为什么它很重要）
当我发布一条新消息时，它会被发送并保存到数据库，但不会发送到浏览器。不过，日志如下所示：
[ActionCable] [an...ey@gmail.com] ConversationsChannel#send_message({"message"=>"23r23r2", "conversation_id"=>5})
[ActionCable] [an...ey@gmail.com]    (0.1ms)  BEGIN
[ActionCable] [an...ey@gmail.com]   SQL (1.1ms)  INSERT INTO "messages" ("conversation_id", "user_id", "body", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5) RETURNING "id"  [["conversation_id", 5], ["user_id", 7], ["body", "23r23r2"], ["created_at", 2017-03-01 01:16:25 UTC], ["updated_at", 2017-03-01 01:16:25 UTC]]
[ActionCable] [an...ey@gmail.com]    (0.9ms)  COMMIT
[ActionCable] [an...ey@gmail.com] [ActiveJob] Enqueued MessageBroadcastJob (Job ID: a464e290-f23f-4cd4-a355-e364a43782e9) to Async(default) with arguments: #<GlobalID:0x007ff678cf74e0 @uri=#<URI::GID gid://itpo/Message/172>>
  Message Load (0.6ms)  SELECT  "messages".* FROM "messages" WHERE "messages"."id" = $1 LIMIT $2  [["id", 172], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9] Performing MessageBroadcastJob from Async(default) with arguments: #<GlobalID:0x007ff679dcc400 @uri=#<URI::GID gid://itpo/Message/172>>
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   Conversation Load (0.3ms)  SELECT  "conversations".* FROM "conversations" WHERE "conversations"."id" = $1 LIMIT $2  [["id", 5], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   User Load (0.7ms)  SELECT  "users".* FROM "users" WHERE "users"."deleted_at" IS NULL AND "users"."id" = $1 LIMIT $2  [["id", 7], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   Rendered messages/_message.html.erb (16.6ms)
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9] Performed MessageBroadcastJob from Async(default) in 28.37ms

[ActionCable][an。。。ey@gmail.com]会话发送消息（{“消息”=>“23r23r2”，“会话id”=>5}）
[ActionCable][an。。。ey@gmail.com]（0.1ms）开始
[ActionCable][an。。。ey@gmail.com]SQL（1.1ms）插入“消息”（“对话id”、“用户id”、“正文”、“创建时间”、“更新时间”）值（$1、$2、$3、$4、$5），返回“id”[[“对话id”，5]，“用户id”，7]，“正文”，“23r23r2”]，[“创建时间”，2017-03-01 01:16:25 UTC]，“更新时间”，2017-03-01:16:25 UTC]]
[ActionCable][an。。。ey@gmail.com]（0.9毫秒）提交
[ActionCable][an。。。ey@gmail.com][ActiveJob]使用参数将MessageBroadcastJob（作业ID:a464e290-f23f-4cd4-a355-e364a43782e9）排队为异步（默认）：#
消息加载（0.6ms）从“消息”中选择“消息”。*其中“消息”。“id”=$1限制$2[[“id”，172]，“限制”，1]]
[ActiveJob][MessageBroadcastJob][a464e290-f23f-4cd4-a355-e364a43782e9]使用参数从异步（默认）执行MessageBroadcastJob：#
[ActiveJob][MessageBroadcastJob][a464e290-f23f-4cd4-a355-e364a43782e9]会话加载（0.3ms）从“对话”中选择“对话”。*其中“对话”为“对话”。“id”=$1限制$2[[“id”，5]，“限制”，1]]
[ActiveJob][MessageBroadcastJob][a464e290-f23f-4cd4-a355-e364a43782e9]用户加载（0.7ms）从“用户”中选择“用户”。*其中“用户”“删除位置”为空且“用户”。“id”=$1限制$2[“id”，7]，“限制”，1]]
[ActiveJob][MessageBroadcastJob][a464e290-f23f-4cd4-a355-e364a43782e9]呈现消息/_message.html.erb（16.6ms）
[ActiveJob][MessageBroadcastJob][a464e290-f23f-4cd4-a355-e364a43782e9]在28.37毫秒内从异步（默认）执行MessageBroadcastJob

由于日志的最后一行显示从异步（默认）
执行了MessageBroadcastJob，这让我相信服务器端不存在问题，也许我的咖啡脚本不知何故被破坏了
也许将新元素插入UL的方式不同于将HTML附加到DIV上
请提供帮助。
问题与_message.html.erb部分视图有关，该视图正在对Desive中的“当前用户”进行比较。我猜无状态的WebSocket访问用户会话数据的范围与视图在常规条件下的访问范围不一样。为了补偿，我在Elevative DOM元素，并创建了一个特殊的JavaScript函数来应用不同的样式，并将数据转换为所需的方式。它现在似乎可以完美地工作
# Be sure to restart your server when you modify this file. Action Cable runs in a loop that does not support auto reloading.
class ConversationsChannel < ApplicationCable::Channel
  def subscribed
    stream_from "conversations_#{params['conversation_id']}_channel"
  end

  def unsubscribed
    # Any cleanup needed when channel is unsubscribed
  end

  def send_message(data)
    current_user.messages.create!(body: data['message'], conversation_id: data['conversation_id'], user: current_user)
  end
end

class MessageBroadcastJob < ApplicationJob
  queue_as :default

  def perform(message)
    ActionCable.server.broadcast "conversations_#{message.conversation.id}_channel",
                                 message: render_message(message)
  end

  private

  def render_message(message)
    MessagesController.render partial: 'messages/message', locals: {message: message}
  end
end

...

  <div id="messages" data-conversation-id="<%= @conversation.id %>">
    <ul class="list-unstyled media-block messages-list" data-conversation-id="<%= @conversation.id %>">
    <%= render @conversation.messages %>
    </ul>
  </div>

...

  <div class="row">
    <%= form_for @message, url: '#' do |f| %>
        <%= hidden_field_tag 'conversation_id', @conversation.id %>
        <div class="form-group">
          <%= f.label :body %>
          <%= f.text_area :body, class: 'form-control' %>
          <small class="text-muted">From 2 to 1000 characters</small>
        </div>

        <%= f.submit "Post", class: 'btn btn-primary btn-lg' %>
    <% end %>
  </div>

...

<% if message.body %>

    <li class="mar-btm message" data-id="<%= message.id %>">
      <div class="<%= message.user == current_user ? 'media-right' : 'media-left' %>">
        <img src="<%= message.user.avatar.url %>" class="img-circle img-sm" alt="Profile Picture">
      </div>
      <div class="media-body pad-hor
        <% if message.user == current_user %>speech-right
        <% end %>">
        <div class="speech">
          <h4><%= message.user.full_name %></h4>
          <%= message.body %>
          <p class="speech-time">
            <i class="demo-pli-clock icon-fw"></i>
            <span class="timestamp" data-value="<%= message.created_at %>"><%= time_ago_in_words message.created_at %>
              ago</span>
          </p>
        </div>
      </div>
    </li>

<% end %>

[ActionCable] [an...ey@gmail.com] ConversationsChannel#send_message({"message"=>"23r23r2", "conversation_id"=>5})
[ActionCable] [an...ey@gmail.com]    (0.1ms)  BEGIN
[ActionCable] [an...ey@gmail.com]   SQL (1.1ms)  INSERT INTO "messages" ("conversation_id", "user_id", "body", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5) RETURNING "id"  [["conversation_id", 5], ["user_id", 7], ["body", "23r23r2"], ["created_at", 2017-03-01 01:16:25 UTC], ["updated_at", 2017-03-01 01:16:25 UTC]]
[ActionCable] [an...ey@gmail.com]    (0.9ms)  COMMIT
[ActionCable] [an...ey@gmail.com] [ActiveJob] Enqueued MessageBroadcastJob (Job ID: a464e290-f23f-4cd4-a355-e364a43782e9) to Async(default) with arguments: #<GlobalID:0x007ff678cf74e0 @uri=#<URI::GID gid://itpo/Message/172>>
  Message Load (0.6ms)  SELECT  "messages".* FROM "messages" WHERE "messages"."id" = $1 LIMIT $2  [["id", 172], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9] Performing MessageBroadcastJob from Async(default) with arguments: #<GlobalID:0x007ff679dcc400 @uri=#<URI::GID gid://itpo/Message/172>>
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   Conversation Load (0.3ms)  SELECT  "conversations".* FROM "conversations" WHERE "conversations"."id" = $1 LIMIT $2  [["id", 5], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   User Load (0.7ms)  SELECT  "users".* FROM "users" WHERE "users"."deleted_at" IS NULL AND "users"."id" = $1 LIMIT $2  [["id", 7], ["LIMIT", 1]]
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9]   Rendered messages/_message.html.erb (16.6ms)
[ActiveJob] [MessageBroadcastJob] [a464e290-f23f-4cd4-a355-e364a43782e9] Performed MessageBroadcastJob from Async(default) in 28.37ms