2017-10-04 12 views
0

私は反応を学んでおり、このチュートリアルのオンラインクイズ反応を持っているので、少し調整しようとします、ユーザーはHellYaをクリックして、 D」 "JP" +1することにより、それぞれが、これは、init状態のための私のコンストラクタが続くJavascript、ReactJs setState not working

this.state = { 
    counter: 0, 
    questionId: 1, 
    question: '', 
    answerOptions: [], 
    answer: '', 
    answersCount: { 
    Green: 0, 
    Brown: 0, 
    Blue: 0, 
    Red: 0, 
    A: 0, 
    B: 0, 
    C: 0, 
    D: 0, 
    EI: 0, 
    SN: 0, 
    TF: 0, 
    JP: 0 
    }, 
    result: '' 
}; 

とチュートリアル以下、私が反応-addons-を使用していますようである私のquizQuestion.js

{ 
question: "I am task oriented in order to achieve certain goals", 
answers: [ 
    { 
    type: "Brown,D,JP", 
    content: "Hell Ya!" 
    }, 
    { 
    type: " ", 
    content: "Nah" 
    } 
] 
}, 

ですanswerCountと答えを更新するための更新、ここに私の関数です

しかし、何回か試してみたら、回答タイプを1ずつ増やす方法はまだ分かりませんが、今はJP +1を更新するだけですが、ブラウンとDを更新しません。ありがとう

答えて

1

これは、常に現在の状態を基本オブジェクトとして使用しているように見えるため、foreach内の最後の回答のみが更新されます。

次のことを試してみてください。

setUserAnswer(answer) { 
if (answer.trim()) { 
    const answer_array = answer.split(','); 
    let answerCountUpdates = update(this.state.answersCount, {$merge: {}}) // copy this.state.answersCount, will search a better way 

    answer_array.forEach((answer) => { 
    answerCountUpdates = update(answerCountUpdates, { 
     [answer]: {$apply: (currentValue) => currentValue + 1} 
    }); 
    }, this); 

    updatedAnswersCount = update(this.state.answersCount, {$merge: answerCountUpdates}) 

    this.setState({ 
    answersCount: updatedAnswersCount, 
    answer: answer 
    }); 
    } 
} 
0

forEach()の反復オブジェクト "answer"と、setUserAnswer()に渡されたパラメータの名前が付けられているようです。おそらく問題を引き起こしているので、これらのいずれかを変更してみてください。