Question

我使用前端框架并想要呈现页面。为此，我使用一个初始化程序，它调用一个函数执行$ .ajax调用后端。但是，虽然在chrome dev工具中请求是成功的，但每次我执行console.log时它都会返回undefined。后端发送正确的结果，但没有显示。

  initialize: =>
    @build_recent()
    @payload=@recent_data
    console.log(@payload)

  render: =>
    $(@el).append homeTemplate(@payload)
    @

  build_recent: =>
    $.ajax(
      url: '/build_recent'
      dataType: 'text/json'
      type: 'GET'
      success: (data) =>
        @recent_data = data
    )

更新

只是使用render（）而不是使用intialize和另一个函数，我终于用这种方式解决了问题：

  render: =>
    $.ajax(
      url: '/build_recent/'
      dataType: 'json'
      type: 'GET'
      success: (data) =>
        @payload = data
        $(@el).append homeTemplate(@payload)
        return @
    )

事实证明问题只是dataType: 'json'以前使用dataType: 'text/json'

现在效果很好

Answer 1

你的coffeescript呈现给：

var _this = this;

({
  initialize: function() {
    _this.build_recent();
    _this.payload = _this.recent_data;
    return console.log(_this.payload);
  },
  render: function() {
    $(_this.el).append(homeTemplate(_this.payload));
    return _this;
  },
  build_recent: function() {
    return $.ajax({
      url: '/build_recent',
      dataType: 'text/json',
      type: 'GET',
      success: function(data) {
        return _this.recent_data = data;
      }
    });
  }
});

你不能从ajax声明返回。你必须使用回调！

因此，您渲染的js代码可以更改为：

({
  initialize: function() {
    _this.build_recent();
    //moved into callback
  },
  render: function() {
    $(_this.el).append(homeTemplate(_this.payload));
    return _this;
  },
  build_recent: function() {
    return $.ajax({
      url: '/build_recent',
      dataType: 'text/json',
      type: 'GET',
      success: function(data) {
        _this.recent_data = data;
        //in callback
        _this.payload = _this.recent_data;
        console.log(_this.payload);
        //prob want to render:
        _this.render();
      }
    });
  }
});

Coffeescript $ .ajax结果显示为未定义

1 个答案: