2013-06-27 38 views
13

Tôi đang di chuyển một ứng dụng web một trang dựa trên Backbone.js và jQuery sang tiện ích mở rộng của Chrome. Tuy nhiên, cả chế độ bộ định tuyến dựa trên băm đều không hoạt động tốt với môi trường bên trong phần mở rộng. Tôi đã đi đến kết luận rằng tôi tốt hơn hết chỉ hiển thị trực tiếp các lượt xem về tương tác của người dùng, bỏ qua toàn bộ hệ thống window.location. Tuy nhiên, tôi không chắc chắn làm thế nào để thực hiện điều này mà không cần thay đổi cuộc gọi đến Router.navigate trong hàng tá tệp.Định tuyến Backbone.js mà không thay đổi url

Có cách nào có thể cắm/mô-đun để giữ hệ thống định tuyến Backbone nhưng bỏ qua bất kỳ thay đổi nào đối với url không?

Trả lời

22

tôi bạn thực sự muốn gắn bó với việc sử dụng Router.navigate được hưởng lợi từ việc định tuyến mà Backbone.js cung cấp mà không phải xử lý lỗi băm băm khi được sử dụng trong tiện ích mở rộng của Chrome (ví dụ: các tuyến đường bao gồm dấu gạch chéo bị ghi đè), bạn có thể thực hiện trực tiếp Router.navigate tải url trực tiếp, bỏ qua toàn bộ thể dục pushState.

Đây thực sự là khá dễ dàng để thực hiện:

Router = Backbone.Router.extend({ 

    navigate: function (url) { 

    // Override pushstate and load url directly 
    Backbone.history.loadUrl(url); 

    }, 

    // Put routes here 
    routes: { } 

}); 

Sau đó bạn có thể gọi Router.navigate(url) để nạp một con đường mới mà không thay đổi lịch sử, hoặc thậm chí ràng buộc hành động để mọi liên kết có chứa một thuộc tính data-backbone (ví dụ <a href="login" data-backbone>Login</a>) với một sự kiện như thế này:

$(function(){ 

    // Initialize router 
    Router = new Router; 
    Backbone.history.start(); 

    // Bind a[data-backbone] to router 
    $(document).on('click', 'a[data-backbone]', function(e){ 
    e.preventDefault(); 

    Router.navigate($(this).attr('href')); 
    }); 

}); 
2

Bạn có thể xác định lại những gì Router.navigate làm, nhưng tốt hơn hết bạn không nên sử dụng Background.router hoàn toàn. Tôi nghĩ rằng nó có thể tạo ra một số nhầm lẫn, và mã của bạn sẽ sạch hơn nếu không có nó nếu bạn đang kích hoạt thay đổi lịch sử từ các khung nhìn.

Backbone.Marionette có khái niệm về Bộ điều khiển, hoạt động giống như bộ định tuyến không có bản đồ URL (với Marionette, ý tưởng là giữ cho định nghĩa tuyến đường của bạn tối thiểu và điều khiển cuộc gọi cho hành vi thay thế). Bạn cũng không cần sử dụng bất kỳ thành phần nào của Marionette mà bạn không muốn.

Nếu bạn thực sự muốn gắn bó với các bộ định tuyến như nó có, bạn có thể có lẽ chỉ xác định lại Backbone.History.navigate đến (lưu ý, chưa được kiểm tra)

navigate: function(fragment, options) { 
    if (!History.started) return false; 
    if (!options || options === true) options = {trigger: options}; 
    fragment = this.getFragment(fragment || ''); 
    if (this.fragment === fragment) return; 
    this.fragment = fragment;  
    if (options.trigger) this.loadUrl(fragment); 
} 
+1

AppRouter là những gì nên được sử dụng thay cho Router. Lớp điều khiển Marionette bây giờ không được chấp nhận - bất kỳ đối tượng nào cũng có thể phục vụ như một bộ điều khiển để sử dụng bởi một AppRouter. – Paul

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