Question

我想返回一个更新的数组到状态，所以我使用带有过滤器的map如下：

state.assignmentClusters.map(cluster => {
                cluster.files.forEach(file => {
                    file.motifList.filter(motif =>{
                        return motif.motif_id !== state.motifIdToDelete;
                    });
                });
            });

由于我需要返回一个数组，因此我在第一个数组上使用了map()，而第二个（文件）只使用了它，而又没有期待任何变化，所以我使用了forEach()在最后一个深度中，我使用filter()返回其ID等于state.motifIdToDelete的所有主题 except （正好是，两个ID都是字符串）。< / p>

PS，这段代码在Vue变异函数中，该函数使我能够变异状态（例如react中的reducer）。

我在这里做什么错了？

谢谢，芽。

Answer 1

我已经以不同的方式解决了这个问题，但我想将答案授予可以向我展示如何使用filter()正确执行此操作的人

当前有效：

state.assignmentClusters.forEach(cluster => {
                    cluster.files.forEach(file => {
                        file.motifList.forEach((motif, index) =>{
                            if (motif.motif_id == state.motifIdToDelete) {
                                file.motifList.splice(index, 1)
                            }
                        });
                    });
                });

Answer 2

您对state.assignmentClusters.map的呼叫未返回任何内容。您应该在箭头函数中返回cluster。另外，您对file.motifList.filter的呼叫不会改变任何内容。您必须在某处使用filter函数返回的值。

state.assignmentClusters.map(cluster => {
    cluster.files = cluster.files.map(file => {
        file.motifList = file.motifList.filter(motif => {
            return motif.motif_id !== state.motifIdToDelete;
        });
        return file;
    });
    return cluster;
});

如果突变无关紧要的另一种选择：

state.assignmentClusters.forEach(cluster => {
    cluster.files.forEach(file => {
        file.motifList = file.motifList.filter(motif => {
            return motif.motif_id !== state.motifIdToDelete;
        });
    });
});

嵌套在parentArray.map（）中的Javascript childArray.filter（）无法过滤

2 个答案: