2013-05-14 29 views
18

tôi rất nhầm lẫn về việc sử dụng phương thức tìm nạp mô hình backbone.js. Xem theo gương
xương sống router:cách phương thức tìm nạp mô hình backbone.js hoạt động

profile: function(id) { 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 
    this.changeView(new ProfileView({model:model})); 
    model.fetch(); 
} 

bước đầu tiên, tài khoản mô hình sẽ được khởi tạo, mô hình tài khoản trông như thế này.

define(['models/StatusCollection'], function(StatusCollection) { 
    var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts', 

    initialize: function() { 
     this.status  = new StatusCollection(); 
     this.status.url = '/accounts/' + this.id + '/status'; 
     this.activity  = new StatusCollection(); 
     this.activity.url = '/accounts/' + this.id + '/activity'; 
    } 
    }); 

    return Account; 
}); 

urlRoot property for it is what? Sau khi đối tượng mô hình được tạo, profileview sẽ được hiển thị với điều này this.changeView (new ProfileView ({model: model}));, chức năng thay đổi trông giống như thế này.

changeView: function(view) { 
    if (null != this.currentView) { 
    this.currentView.undelegateEvents(); 
    } 
    this.currentView = view; 
    this.currentView.render(); 
}, 

sau khi render xem, thông tin hồ sơ sẽ không hiển thị được nêu ra, nhưng sau khi model.fetch(); thực thi câu lệnh, dữ liệu từ mô hình sẽ được hiển thị, tại sao? Tôi thực sự không biết làm thế nào lấy công trình, tôi cố gắng tìm hiểu, nhưng không có cơ hội.

Trả lời

38

Tôi không hoàn toàn chắc chắn câu hỏi của bạn là gì, nhưng tôi sẽ cố hết sức để giải thích những gì tôi có thể.

Khái niệm đằng sau urlRoot là URL cơ sở và phần tử con sẽ được tìm nạp bên dưới nó với id được thêm vào urlRoot đó.

Ví dụ, đoạn mã sau:

var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts' 
}); 

sẽ thiết lập các địa chỉ cơ sở. Sau đó, nếu bạn đã nhanh chóng này và gọi lấy():

var anAccount = new Account({id: 'abcd1234'}); 
anAccount.fetch(); 

nó sẽ làm cho các yêu cầu sau đây:

GET /accounts/abcd1234 

Trong trường hợp của bạn có, bạn đang thiết lập các urlRoot và sau đó thiết lập một cách rõ ràng url do đó urlRoot bạn cung cấp sẽ bị bỏ qua.

tôi khuyến khích bạn xem xét các nguồn Backbone (đó là đáng ngạc nhiên ngắn gọn) để xem cách các url có nguồn gốc: http://backbonejs.org/docs/backbone.html#section-65

Để trả lời câu hỏi khác của bạn, lý do thông tin cá nhân của bạn sẽ không hiển thị ngay lập tức là lấy () đi ra ngoài mạng, truy cập vào máy chủ của bạn và phải chờ trả lời trước khi có thể hiển thị.

Đây không phải là ngay lập tức.

Nó được thực hiện theo kiểu không bị chặn, có nghĩa là nó sẽ đưa ra yêu cầu, tiếp tục làm những gì nó đang làm, và khi yêu cầu trở lại từ máy chủ, nó sẽ kích hoạt sự kiện mà Backbone sử dụng để đảm bảo mọi thứ khác điều đó phải được thực hiện, bây giờ bạn đã có dữ liệu của mô hình, được thực hiện.

Tôi đã đặt một số ý kiến ​​trong đoạn mã của bạn để giải thích những gì đang xảy ra ở đây:

profile: function(id) { 
    // You are instantiating a model, giving it the id passed to it as an argument 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 

    // You are instantiating a new view with a fresh model, but its data has 
    // not yet been fetched so the view will not display properly 
    this.changeView(new ProfileView({model:model})); 

    // You are fetching the data here. It will be a little while while the request goes 
    // from your browser, over the network, hits the server, gets the response. After 
    // getting the response, this will fire a 'sync' event which your view can use to 
    // re-render now that your model has its data. 
    model.fetch(); 
} 

Vì vậy, nếu bạn muốn đảm bảo tầm nhìn của bạn được cập nhật sau mô hình đã được lấy có một vài cách bạn có thể làm điều đó: (1) chuyển một cuộc gọi lại thành công đến mô hình.fetch() (2) đăng ký trình xử lý trên đồng hồ của bạn xem sự kiện 'đồng bộ', hiển thị lại chế độ xem khi nó trả về (3) đặt mã để khởi tạo chế độ xem của bạn trong cuộc gọi thành công, theo cách đó, chế độ xem sẽ không được tạo cho đến sau khi yêu cầu mạng trả về và mô hình của bạn có dữ liệu của nó.

+0

cảm ơn đầu tiên cho câu trả lời, đây là mô tả rất hay. tôi có một số câu hỏi nhiều hơn, sau khi fetch() bắn sự kiện 'đồng bộ', xem sẽ tự động hiển thị? những gợi ý mà bạn cho tôi, bạn có thể làm cho một số ví dụ, vì tôi khá mới trong backbonejs và javascript tôi biết rằng ngôn ngữ tốt nhưng không phải là rất tốt. –

+0

urlroot sẽ được ghi đè đúng không? Cuz của var base = _.result (this, 'urlRoot') || _.result (this.collection, 'url') || urlError() ;? –

+0

Đối với câu hỏi đầu tiên của bạn, không có sự kiện đồng bộ hóa sẽ không tự động hiển thị chế độ xem. Nếu bạn muốn bật tính năng này, hãy thêm thông tin sau: "view.on ('sync', this.render, this);" –

Các vấn đề liên quan