Tôi đã phát triển các ứng dụng Backbone một thời gian ngắn và tôi chỉ bắt đầu học cách sử dụng Backbone với Require.js.Thực tiễn tốt nhất cho các đối tượng dùng chung trong Backbone/Require Application
Trong ứng dụng xương sống của tôi mà tôi đang tái cấu trúc, tôi đã xác định không gian tên như sau: App.model.repo. Mô hình này được sử dụng hơn và hơn nữa trong các khung nhìn khác nhau. Tôi làm điều tương tự với một vài bộ sưu tập, ví dụ: App.collection.files. Các mô hình và bộ sưu tập này được khởi động cùng với yêu cầu tệp chỉ mục ban đầu.
Tôi đã tìm thấy this example, trông giống như một cách tuyệt vời để có được dữ liệu được khởi động đó. Tuy nhiên, tôi đang đấu tranh với cách tốt nhất để sử dụng lại/chia sẻ các mô hình và bộ sưu tập này giữa các chế độ xem.
Tôi có thể nghĩ đến ba giải pháp khả thi. Điều nào là tốt nhất và tại sao? Hoặc là có một giải pháp tôi đang thiếu hoàn toàn?
Giải pháp 1
Xác định các mô-đun phổ biến và các bộ sưu tập trong chỉ mục (khi chúng được bootstrapped in), và sau đó vượt qua chúng cùng với nhau xem Backbone như một tùy chọn (của initialize).
define(['jquery', 'underscore', 'backbone', 'handlebars', 'text!templates/NavBar.html'],
function($, _, Backbone, Handlebars, template){
return Backbone.View.extend({
template: Handlebars.compile(template),
initialize: function(options){
this.repoModel = options.repoModel; // common model passed in
}
});
}
);
Đây có vẻ sạch sẽ như xa cách ly, nhưng có thể trở nên sôi nổi nhanh chóng, với hàng nghìn thứ được truyền khắp nơi.
Giải pháp 2
Xác định một mô-đun globals, và thêm các mô hình thường được sử dụng và các bộ sưu tập với nó.
// models/Repo.js
define(['backbone'],
function(Backbone){
return Backbone.Model.extend({
idAttribute: 'repo_id'
});
}
);
// globals.js (within index.php, for bootstrapping data)
define(['underscore', 'models/Repo'],
function(_, RepoModel){
var globals = {};
globals.repoModel = new Repo(<?php echo json_encode($repo); ?>);
return globals
}
);
define(['jquery', 'underscore', 'backbone', 'handlebars', 'text!templates/NavBar.html', 'globals'],
function($, _, Backbone, Handlebars, template, globals){
var repoModel = globals.repoModel; // repoModel from globals
return Backbone.View.extend({
template: Handlebars.compile(template),
initialize: function(options){
}
});
}
);
Giải pháp này có đánh bại toàn bộ điểm của AMD không?
Giải pháp 3
Làm một số mô hình và bộ sưu tập trở lại một ví dụ, thay vì một nhà xây dựng (có hiệu quả làm cho chúng Singletons).
// models/repo.js
define(['backbone'],
function(Backbone){
// return instance
return new Backbone.Model.extend({
idAttribute: 'repo_id'
});
}
);
// Included in index.php for bootstrapping data
require(['jquery', 'backbone', 'models/repo', 'routers/Application'],
function($, Backbone, repoModel, ApplicationRouter){
repoModel.set(<?php echo json_encode($repo); ?>);
new ApplicationRouter({el: $('.site-container')});
Backbone.history.start();
}
);
define(['jquery', 'underscore', 'backbone', 'handlebars', 'text!templates/NavBar.html', 'models/repo'],
function($, _, Backbone, Handlebars, template, repoModel){
// repoModel has values set by index.php
return Backbone.View.extend({
template: Handlebars.compile(template),
initialize: function(options){
}
});
}
);
Điều này tôi lo lắng có thể gây nhầm lẫn thực sự về hàm tạo và ví dụ là gì.
End
Nếu bạn đọc đến đây, bạn là tuyệt vời! Cảm ơn đã dành thời gian.
Tôi đã thử cả tùy chọn 1 và 3, bằng cách tái cấu trúc ứng dụng hiện có của tôi. Lựa chọn 1 nhanh chóng có lông, với các tùy chọn được truyền đi khắp mọi nơi, thường thông qua một mô-đun mà không cần tất cả, chỉ để có được một mô-đun con mà đã cần nó. Cuối cùng, lựa chọn 3 cảm thấy sạch hơn nhiều với tôi. Sự thật là tôi đang sử dụng tất cả 3 tùy chọn trong dự án hiện tại của mình. Tùy chọn 1 cho các phần tử vòng đời ngắn. Tùy chọn 2 cho những thứ đơn giản như "apiUrl" (url gốc chung). Tùy chọn 3 cho các mô hình xương sống và các bộ sưu tập được sử dụng rộng rãi. – Bart
Tiếp tuyến liên quan: http://stackoverflow.com/a/15528785/158651 – Bart