ジャバスクリプト

Question

内のオブジェクトの配列から重複した値を削除し、私はこのようなオブジェクトの配列を持っています。 iユーザーArray.prototype.unshiftは、配列の最上部に目的の要素を追加します。 だから私はarr.unshift({label: All, value: All})と書く。私のコンポーネントが最初にレンダリングされたとき、私の望むとおりに正常に作成されます。しかし、私がそれを再レンダリングすると、値{label: All, value: All}の配列が複製として表示されます。具体的には次のように表示されます：

arr = [ 
    {label: All, value: All}, 
    {label: All, value: All}, 
    {label: Alex, value: Ninja}, 
    {label: Bill, value: Op}, 
    {label: Cill, value: iopop} 
] 

どうすればこの問題を解決できますか？ここでは特定のトピックで説明した方法を試しましたが、機能しませんでした。

Answer 1

array#reduceとarray#findを使用できます。 [JavaScriptでオブジェクトの配列から重複を削除]の

const arr = [ 
 
    {label: 'All', value: 'All'}, 
 
    {label: 'All', value: 'All'}, 
 
    {label: 'Alex', value: 'Ninja'}, 
 
    {label: 'Bill', value: 'Op'}, 
 
    {label: 'Cill', value: 'iopop'} 
 
] 
 

 
var result = arr.reduce((unique, o) => { 
 
    if(!unique.find(obj => obj.label === o.label && obj.value === o.value)) { 
 
    unique.push(o); 
 
    } 
 
    return unique; 
 
},[]); 
 
console.log(result);