2013-08-17 55 views
7

Câu hỏi liên quan -Thực hành tốt nhất cho việc di chuyển mô hình xương sống trong một bộ sưu tập

BackboneJS best way to rearrange models in a collection while maintaining 0-indexed ordinal property for each model

How can I move a model within a collection?

Tôi có một bộ sưu tập Backbone, đại diện trực quan trong một danh sách. Danh sách này là kéo/droppable. Bất kỳ mục nào cũng có thể được chuyển đến một vị trí tùy ý trong bộ sưu tập (ví dụ - không phải là một loại). Tôi đã thấy một số ví dụ sử dụng tính năng xóa/thêm gốc của bộ sưu tập để đặt mô hình vào đúng vị trí. Tuy nhiên, các cuộc gọi nội bộ Backbone được thiết lập khi các mô hình được thêm vào, sau đó gọi một loạt các phương thức liên quan đến các sự kiện và sắp xếp nó ở cuối. Có nhược điểm nào khi chỉ nối mô hình vào đúng vị trí?

Xóa/Thêm: Xem ví dụ trong câu hỏi được liên kết đầu tiên.

Splice: Thứ hai ví dụ

Function Tôi hiện đang sử dụng:

moveTo: function(oldIndex, newIndex){ 
     oldIndex = oldIndex instanceof Backbone.Model ? this.at(oldIndex) : oldIndex; 
     var spliced = this.models.splice(oldIndex, 1); 
     this.models.splice(newIndex, 0, spliced[0]); 
     this.trigger("move",[oldIndex,newIndex]); 
    }, 
+3

Bạn có chắc đây không phải là một loại? Drag'n'drop để di chuyển mọi thứ xung quanh là thay đổi thủ công các chỉ mục phần tử và một mảng/bộ sưu tập là cái gì đó được, nhiều hay ít, được sắp xếp theo chỉ mục. –

+0

Tôi đoán 'kỹ thuật' bạn có thể gọi nó là một loại, tôi chỉ có nghĩa rằng nó là một tùy ý, không phải là một tự động dựa trên tài sản của mảng. Nhưng tôi nghĩ rằng bạn đang chỉ ra rằng điều này là tương đương với một 'sắp xếp', vì cả hai chỉ sắp xếp lại các mục, và do đó Backbone không có vấn đề với nó. – iabw

+0

Câu hỏi của tôi có thể được diễn đạt rõ ràng hơn - "Có bao giờ một tình huống mà bạn muốn xóa và thêm lại Mô hình vào Bộ sưu tập, thay vì tự phân loại chúng không?" ;) – iabw

Trả lời

11

tôi đã viết giải pháp này cho dự án gần đây nhất của tôi. Nó có vẻ là một giao diện tương tự với những gì bạn mô tả - một danh sách có thể sắp xếp. Phương pháp này được liên kết với bộ sưu tập.

reorder: function(new_index, original_index) { 
    // If nothing is being changed, don't bother 
    if (new_index === original_index) return this; 
    // Get the model being moved 
    var temp = collection.at(original_index); 
    // Remove it 
    collection.remove(temp); 
    // Add it back in at the new index 
    collection.add(temp, { at: new_index }); 
    return this; 
} 

Hầu hết mã của riêng tôi đã bị xóa nhưng đó là chức năng chính. Backbone's at tùy chọn làm cho điều này thực sự dễ dàng.

+2

Bạn có thể muốn tắt tiếng cuộc gọi 'remove' và' add' để ngăn các thay đổi không mong muốn trên các giao diện đang nghe bộ sưu tập và các mô hình bên trong. Bạn cũng có thể muốn tạo sự kiện 'di chuyển' của riêng mình để cho phép người nghe phản ứng tương ứng. –

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