Triển khai mẫu tổng hợp bằng cách sử dụng MVC/Backbone.js

Question

Ứng dụng web của tôi có cấu trúc tổng hợp, nghĩa là mỗi bộ sưu tập Danh mục có thể chứa hỗn hợp các Mục riêng lẻ và Danh mục khác làm hàng/nút/trẻ em (không chắc chắn về thuật ngữ chính xác tại đây). Trong thực tế, nó đơn giản hơn một chút vì mỗi bộ sưu tập được đại diện bởi một mô hình, Category, do đó, về cơ bản, mỗi bộ sưu tập Category có cả hai mô hình Item và Category là con của nó.

Nói chung đây là một cách được khuyến khích để thực hiện cấu trúc này bằng cách sử dụng MVC? Cụ thể hơn, trong Backbone.js là nó có thể cho một bộ sưu tập để có một nhà máy mô hình (lấy json và tính toán mô hình nào để tạo ra dựa trên cấu trúc của json) thay vì một thuộc tính mô hình tĩnh?

Answer 1

Có, bạn có thể. Tôi đã hoàn thành nó trước đây. Tôi nghĩ rằng các liên kết này có thể giúp bạn: http://documentcloud.github.com/backbone/#Collection-model

Đây là một trong những kịch bản chính tôi sử dụng cho dự án của tôi: https://gist.github.com/b65893e0c2e3c46d3dc1

Answer 2

Tôi giả sử bạn đang nhận được một danh sách loại/Các đề mục trong JSON trông giống như sau này ...

{ 
    'id': 1, 
    'name': 'My 1st Category', 
    'children': [ 
     { 
      'id': 2, 
      'name': 'My 2nd Category', 
      'children': [] 
     }, 
     { 
      'id': 1, 
      'name': 'An Item', 
      'price': 109.99 
     } 
    ] 
} 

Backbone.js không có bất kỳ thứ gì ngoài hộp hỗ trợ nhiều mô hình trong bộ sưu tập, nhưng cũng không có bất kỳ hạn chế nào về loại mô hình bạn đưa vào bộ sưu tập .

Chỉ định loại mô hình trong định nghĩa bộ sưu tập chỉ có một điều, nó cho phép Backbone biết loại mô hình nào sẽ tạo nếu bạn chuyển JSON thô vào bộ sưu tập thay vì đối tượng Backbone.Model. Nếu bạn thêm một mô hình Item vào một bộ sưu tập đã chứa một vài mô hình Category, xương sống sẽ không có vấn đề gì khi đưa nó vào danh sách mô hình; nó không làm bất kỳ kiểm tra kiểu nào.

Vì vậy, với ý nghĩ đó, bạn có thể sử dụng hầu hết mọi thứ mà bộ sưu tập cung cấp ngoại trừ truyền JSON thô; bạn sẽ cần phải tự mình xử lý. Vì vậy, lựa chọn của bạn là xây dựng mô hình của bạn trước, biến chúng thành các đối tượng Backbone.Model hoặc tạo một thứ gì đó sẽ thực hiện phân tích cú pháp cho bạn.

Đối với tùy chọn thứ hai, trình phân tích cú pháp, tôi khuyên bạn nên chuyển một biến đặc biệt cho bộ sưu tập chứa JSON thô của bạn, sau đó xử lý trong hàm initialize của bạn. Dưới đây là một ví dụ:

var CategoryCollection = Backbone.Collection.extend({ 
    initialize: function(m, models) { 
     _.each(models, function(model) { 
      var modelObject = null; 
      if (model.price !== undefined) { 
       modelObject = new Item(model); 
      } else { 
       modelObject = new Category(model); 
      } 

      this.add(modelObject); 
     }, this); 
    } 
}); 

Vì vậy, nó là một chút hacky, nhưng bạn xác định loại mô hình dựa trên nếu nó có một lĩnh vực cụ thể (price trong ví dụ của tôi), tạo ra các đối tượng mô hình, sau đó bổ sung vào bộ sưu tập.

Sau đó bạn muốn gọi nó theo cách này:

var myCollection = new CategoryCollection([], myJSON); 

Chú ý bạn phải vượt qua một mảng trống rỗng như là đối số đầu tiên kể từ đó là làm sao cậu thường thông qua một tập hợp các mô hình để bộ sưu tập.

Sau này khi sử dụng bộ sưu tập, bạn có thể xác định xem bạn đang làm việc với một Item hoặc Category sử dụng đơn giản instanceof kiểm tra:

_.each(myCollection.models, function(model) { 
    if (model instanceof Item) { 
     console.log("It's an Item! Price: ", model.get("price")); 
    } else { 
     console.log("It's a Category!"); 
    } 
}); 

Answer 3

Nó khá đơn giản đạt được bằng cách ghi đè được xây dựng trong các phương pháp công parse và toJSON được sử dụng nội bộ bằng xương sống khi truy xuất và lưu dữ liệu của mô hình.

Trước hết khi bạn lấy lại Mô hình từ cơ sở dữ liệu, bạn nên ghi đè phương thức parse của mô hình để tạo mô hình đại diện cho các mục nhất định từ ví dụ của bạn.

Sau đó, lưu phương thức toJSON được sử dụng để tuần tự hóa dữ liệu về máy chủ có thể hiểu - bạn chỉ cần gọi phương thức toJSON trên Mô hình của từng mục. Nếu bạn nhìn vào mã cho Backbone.sync, bạn sẽ thấy rằng mô hình luôn luôn được tuần tự hóa bằng cách sử dụng toJSON nếu không có dữ liệu tùy chỉnh nào được chuyển.

Hãy cho tôi biết nếu bạn cần thêm thông tin chi tiết mặc dù tôi tin rằng bạn sẽ có thể nhận thông tin từ đây!

Answer 4

Có, bạn có thể sử dụng mẫu Phương thức nhà máy để tạo mô hình trong Bộ sưu tập của xương sống. Giả sử các cấu trúc dữ liệu đề xuất trong @kpeel's answer, bạn có thể xác định

// Factory method 
var CategoryOrItemFactory = function(data, options) { 
    if (data.children) { 
     return new Category(data, options); 
    } else { 
     return new Item(data, options); 
    } 
}; 

// Model definitions 
var Item = Backbone.Model.extend(); 

var Category = Backbone.Model.extend({ 
    initialize: function() { 
     this.children = new Children(this.get("children")); 
    } 
}); 

var Children = Backbone.Collection.extend({ 
    model: CategoryOrItemFactory 
}); 

Sau đó bạn sẽ tạo mục gốc của bạn (loại) và có cấu trúc hoàn chỉnh dữ liệu được tạo ra:

// create the root item 
var rootItem = new Category(rawData); 

Tiếp cận một loại trẻ em tài sản children của nó , ví dụ

rootItem.children.get(2).get("name"); 

Đây là số jsFiddle with the above code để chơi cùng.