0

我有一个属性的视图,我想在发出获取请求时更新它的值。

    define(['underscore','backbone','models/taskCollection'],
            function( _,Backbone,TaskCollection) {
            var UserTasksView = Backbone.View.extend({
                el:"#user-task-list",
                cur_task: undefined,
                initialize: function() {
                    this.collection = new TaskCollection;
                    this.model = this.collection._model;

                    _.bindAll(this,'render');
                    this.collection.bind('reset',this.render);
                },
view_task: function( event ) {

                var el = $(event.currentTarget);
                var task_id = el.attr('data-taskid');
                var row = el.parents('td').parents('tr.task-row');

                row.addClass("active");

                el.hide();
                el.next('a').show();

                var task = this.collection.fetch({
                    data: {id:task_id},
                    silent:true,
                    success:this._task_fetch_success
                });

                this._show_task_detail();

                event.preventDefault();
            },

            _task_fetch_success: function(response,status,xhr) {
                this.cur_task = JSON.stringify(status);
                return status;
            },

            /**
            * Displays the details of a task
            **/
            _show_task_detail: function() {
                var main = $('.app-content');
                var detail_view = $('.app-extra');
                var task_detail_view = $("#task-detail-view");

                //Reduce task list view width
                main.animate({
                    "width":"50%"
                },2000);
                //Display app extra bar
                detail_view.show();
                //show task detail  view
                detail_view.children('active-page').hide().removeClass('active-page').addClass('inactive-page');
                task_detail_view.show().removeClass('inactive-page').addClass('active-page');
                console.log(this.cur_task);
                var template = ich.task_detail(this.cur_task)
                $('div.task-details').html(template);
            }

fetch 触发的 ajax 请求成功并执行成功回调,但是当我尝试记录“cur_task”属性时,它显示为未定义;我究竟做错了什么

4

1 回答 1

1

你有几个问题从这里开始:

var task = this.collection.fetch({
    data: {id:task_id},
    silent:true,
    success:this._task_fetch_success
});

和这里:

_task_fetch_success: function(response,status,xhr) {
    this.cur_task = JSON.stringify(status);
    return status;
}

首先,success回调不是 jQuery 成功回调,不接收通常的 jQuery 参数;来自精美手册

options哈希值success和回调函数将作为参数error传递。(collection, response)

所以你的_task_fetch_success函数不像你期望的那样被f(collection, response)调用f(response, status, xhr);这就是为什么您必须将status参数视为 JSON:status实际上是response.

您的下一个问题是,这this不是您认为的_task_fetch_success函数内部的内容。Backbonefetch只是success作为一个普通的旧函数调用

  var success = options.success;
  options.success = function(resp, status, xhr) {
    collection[options.add ? 'add' : 'reset'](collection.parse(resp, xhr), options);
    if (success) success(collection, resp, options); // <--------------- Right here
    collection.trigger('sync', collection, resp, options);
  };

这意味着那this将是window,而不是你的观点。解决此问题的最简单方法是添加_task_fetch_success到您的_.bindAll列表中initialize

initialize: function() {
    //...
    _.bindAll(this, 'render', '_task_fetch_success');
    //...
}
于 2012-07-18T21:35:44.487 回答