Rails 中的 Jquery Ajax 响应返回未定义的数据

Question

我正在尝试使用 ajax，所以只有部分重新加载而不是整个网站，但数据返回未定义。我做错了什么吗？代码如下：

/* form.js */

$(document).ready(() => {
  $('#stock-lookup-form').on('ajax:complete', (e, data, status) => {
    /*$('#results').html(data.responseText)*/
    console.log(data) /* --> this returns undefined*/
  }) 
})

/* stock_controller.rb */

class StocksController < ApplicationController
  def search
    if params[:stock].present?
      @stock = Stock.new_from_lookup(params[:stock])
      if @stock
        render partial: 'users/result'
      else
        flash[:danger] = "You have entered an incorrect symbol"
        redirect_to my_portfolio_path
      end
    else 
      flash[:danger] = "You have entered an empty search string"
      redirect_to my_portfolio_path
    end
  end
end

/* result.html.erb 部分 */

<%if @stock%>
  <div class="well results-block">
    <strong>Symbol: </strong><%=@stock.ticker%>
    <strong>Name: </strong><%=@stock.name%>
    <strong>Last price: </strong><%=@stock.last_price%>
  </div>
<%end%>

/* my_portfolio.html.erb（表单所在的位置）*/

<h1>My portfolio</h1>

<h3>Search for stocks</h3>
<div id="stock-lookup">
  <%=form_tag search_stocks_path, remote: true, method: :get, id: 'stock-lookup-form' do%>
    <div class="form-group row no-padding text-center col-md-12">
      <div class="col-md-10">
        <%=text_field_tag :stock, params[:stock], placeholder:'Stock ticker symbol', autofocus:true, class:'form-control search-box input-lg'%>
      </div>
      <div class="col-md-2">
        <%=button_tag(type: :submit, class:'btn btn-lg btn-success', id:'search-btn') do%>
          <i class="fa fa-search"></i> Look up a stock
        <%end%>
      </div>
    </div>
  <%end%>
</div>
<div id="results">
  <%=render 'users/result'%>
</div>

Answer 1

[The] 对 UJS 事件处理程序的调用签名已更改。与使用 jQuery 的版本不同，所有自定义事件都只返回一个参数：event。在此参数中，有一个附加属性详细信息，其中包含一组额外参数。 https://guides.rubyonrails.org/working_with_javascript_in_rails.html#rails-ujs-event-handlers

$(document).ready(() => {
  $('#stock-lookup-form').on('ajax:complete', (event) => {
    const [data, status, xhr] = event.detail;
    console.log(data);
  });
});