Rails 动作电缆，POST 后输入未被清除

Question

我有这段代码并且工作正常，只是注意到 'event.keyCode' 被描述为 VScode 说


consumer.subscriptions.create("CommentsChannel", {
  connected() {
    // Called when the subscription is ready for use on the server
  },

  disconnected() {
    // Called when the subscription has been terminated by the server
  },

  received(data) {
    console.log(data.content)
    $('#comments').append('<strong>' + data.content[1] + ': ' + '</strong>' + data.content[0] + ' ' + data.content[2] + ' <hr class="comments-hr">' )
    // Called when there's incoming data on the websocket for this channel
  }
});

var submit_messages;

$(document).on('turbolinks:load', function() {
  submit_messages()
})

submit_messages = function (){
  $('#new_comment').on('keydown', function (event){
    if(event.keyCode === 13){
      $('#send_button').click()
      event.target.value = ''
      event.preventDefault()
    }
  })
}

所以我改成了

submit_messages = function (){
  $('#new_comment').on('keydown', function (event){
    if(event.key === 'Enter'){
      $('#send_button').trigger( "click" )
      event.target.value = ''
      event.preventDefault()
    }
  })

所以我现在面对上面两个选项的问题是，在我按下按钮或清除按回车后，输入没有被清除

如果使用这个

$('#comment_field').val('')

然后按回车键我根本没有得到值但是当我点击按钮时我得到了

这是模型


    def self.post_comment(new_comment,ticket,user)
        ticket.comment.tap do |post_new_comment|
            post_new_comment.content << new_comment
            post_new_comment.username << user
            post_new_comment.sendtime << Time.now
                if post_new_comment.save
                    ActionCable.server.broadcast 'comments_channel', content: [new_comment, user, Time.now.strftime("%H:%M:%S")]
                end
        end
    end

输入字段

        <%= f.text_field :comment, class: "form-control", placeholder: "Write a Comment", id: "comment_field" if @ticket.status%>

和按钮

    def submit_comment_button
        content_tag(:button, class: "btn btn-sm btn-primary", id: "send_button") do
            content_tag(:i, class: "bi bi-arrow-right-square") do
            end
        end  
    end

Answer 1

我找到的解决办法是移动

$('#comment_field').val('')

在received(data)

那样


  received(data) {
    console.log(data.content)
    $('#comments').append('<strong>' + data.content[1] + ': ' + '</strong>' + data.content[0] + ' ' + data.content[2] + ' <hr class="comments-hr">' )
    // Called when there's incoming data on the websocket for this channel
    $('#comment_field').val('')

  }
});

var submit_messages;

$(document).on('turbolinks:load', function() {
  submit_messages()
})

submit_messages = function (){
  $('#new_comment').on('keydown', function (event){
    if(event.key === 'Enter'){
      $('#send_button').trigger( "click" )
      //$('#comment_field').val('')
      //event.target.value = ''
      event.preventDefault()
    }
  })
  
}

如果有人能解释为什么我必须做出那个改变以及为什么它在工作之前我会很高兴！

Rails 动作电缆，POST 后输入未被清除

Rails action cable, Input doesn't get cleared after POST

javascript

ruby-on-rails-5

actioncable