2016-07-25 12 views
0
getInitialState: function() { 
    p:{'Keeper' : [] , 'Defenders': [] , 'Midfield' : [], 'Forwards' : []}} 
} 
onUpdatePlayers : function (newState) { 
    var pos; 

    if (newState.position.includes('Back')) { 
     pos = 'Defenders' 
    } else if (newState.position.includes('Midfield')){ 
     pos = 'Midfield' 
    } else if (newState.position.includes('Forward')) { 
     pos = 'Forwards' 
    } else { 
     pos = newState.position; 
    } 

    this.state.p[pos].push(newState) 
} 

基本的には、いくつかの配列を複数の状態のプロパティにプッシュしたいと思います。 何とか、このコード "this.state.p [pos] .push(newState)"をthis.setStateを使用するように変更する必要があります。私はそれをグーグルきたと明らかに、それは全く役に立ちませんReact - 配列を状態にプッシュ

this.setState({ 
     p : this.state.p[pos].concat([newState]) 
    }); 

のようなものを見つけました。これについて私に助言してもらえますか? 大変ありがとうございます。

乾杯!

答えて

0

本当に状態が深くネストされる必要がある場合は、pプロパティ全体を新しいオブジェクトに置き換える必要があります。 Object.assign

this.setState({ 
    p: Object.assign(this.state.p, { 
    [pos]: this.state.p[pos].concat(newState) 
    }) 
}) 
+0

ありがとうございました。あなたの方法でうまくいきます。 !! しかし、私は多分getInitialStateメソッドを使用して複数の状態の配列を定義する最良の方法ではないと思う。 私はInitialStateを持っていないとしましょう。 同じ結果を返すためにもっとクリーンで良い方法はありますか?深くネストしたり、Object.assignを使用したりしないでください。 –

+0

"あなたのメソッドでは動作します。"あなたはこれについてより正確になりますか? newStateが配列の場合、このコードは状態にあるコードと連結しなければなりません。 'Object.assign'は1レベルの深さで動作します。ディープクローンを作成するには、コードを書くかライブラリ(例えばlodash)を使用する必要があります。 –

0

Danny Kimを使用してたとえば、あなたが追加したい新しいキーに引用符が欠落しています。最後の行を

に変更
this.state.p['pos'].push(newState) 
+1

posは変数スコープです。文字列ではありません。とにかくお返事ありがとうございます。 –

関連する問題