Cách tốt nhất để xóa phần tử khỏi Danh sách bên trong Bản đồ trong Immutable.js

Question

Tôi đang sử dụng Facebook's Immutable.js để tăng tốc độ ứng dụng React của mình để tận dụng lợi thế của PureRender mixin. Một trong những cấu trúc dữ liệu của tôi là Map() và một trong các khóa trong bản đồ đó có giá trị là List<Map>(). Điều tôi đang tự hỏi là, không biết chỉ mục của mục tôi muốn xóa khỏi số List(), cách tốt nhất để loại bỏ nó là gì? Cho đến nay tôi đã đưa ra dưới đây. Đây có phải là cách tốt nhất (hiệu quả nhất) không?

// this.graphs is a Map() which contains a List<Map>() under the key "metrics" 
onRemoveMetric: function(graphId, metricUUID) { 
    var index = this.graphs.getIn([graphId, "metrics"]).findIndex(function(metric) { 
     return metric.get("uuid") === metricUUID; 
    }); 
    this.graphs = this.graphs.deleteIn([graphdId, "metrics", index]); 
} 

(. Tôi đã xem xét di chuyển List<Map>() đến một Map() bản thân vì mỗi phần tử trong danh sách có một UUID, tuy nhiên, tôi không phải tại thời điểm đó chưa)

Answer 1

Bạn có thể sử dụng Map.filter:

onRemoveMetric: function(graphId, metricUUID) { 
    this.graphs = this.graphs.setIn([graphId, "metrics"], 
    this.graphs.getIn([graphId, "metrics"]).filter(function(metric) { 
     return metric.get("uuid") !== metricUUID; 
    }) 
) 
} 

Từ quan điểm hiệu suất chuyển sang bản đồ có thể hiệu quả hơn vì mã này (giống như của bạn) phải lặp qua các phần tử trong danh sách.

Answer 2

Sử dụng updateIn theo đề xuất của @YakirNa điều này sẽ trông giống như bên dưới.

ES6:

onRemoveMetric(graphId, metricUUID) { 
    this.graphs = this.graphs.updateIn([graphId, 'metrics'], 
     (metrics) => metrics.filter(
     (metric) => metric.get('uuid') !== metricUUID 
    ) 
    ); 
    } 

ES5:

onRemoveMetric: function(graphId, metricUUID) { 
    this.graphs = this.graphs.updateIn([graphId, "metrics"], function(metrics) { 
     return metrics.filter(function(metric) { 
     return metric.get("uuid") !== metricUUID; 
     }); 
    }); 
    }