リアクションレンダリングマップ最後の要素が更新されません

Question

マップ内の最後のFileComponentが状態の変更を反映していないため、イベントがshouldComponentUpdateを呼び出せません。他のFileComponentsを変更した後（ただし最後）、最後のものを除くすべてが変更を反映し、それぞれがshouldComponentUpdateを呼び出します。 FileComponentで

{this.props.files.map((file,index)=>{ 
    return (
     <FileComponent type="upload" key={index} index={index} /> 
    ) 
})} 

iはonClickの機能とボタンがあります：

this.props.dispatch({type: "EDIT_FILE", payload: this.props.index}); 
    // SOME STRANGE BEHAVIOUR 
    // if(this.props.index+1 == this.props.files.length){ 
    //  this.forceUpdate(); 
    // } 

私の減速が含まれています

function getInitialState(){ 
    return { 
    files: [ 
     {name: 'asd.doc', in_edit: false, 
      file: {type:'image/png', size:123123, lastModifiedDate:new Date()} 
     }, 
     {name: '22.doc', in_edit: false, 
      file: {type:'image/png', size:123123, lastModifiedDate:new Date()} 
     }, 
     {name: 'as33d.doc', in_edit: false, 
      file: {type:'image/png', size:123123, lastModifiedDate:new Date()} 
     }, 
     {name: '44.doc', in_edit: false, 
     file: {type:'image/png', size:123123, lastModifiedDate:new Date()} 
     }, 
    ] 
} 
} 

export default function (state = getInitialState(), action) { 
switch (action.type) { 

case "EDIT_FILE": 
     state.files[action.payload]['in_edit'] = !state.files[action.payload]['in_edit']; 
     return Object.assign({}, state); 
default: 
     return state 
} 
} 

パッケージには、コンポーネントに反応

は私がこれを使用する方法をレンダリングします。 json：

"react": "^15.3.2", 
"react-dom": "^15.3.2", 
"react-dropzone": "^3.7.3", 
"react-redux": "^4.4.5", 
"react-router": "^3.0.0", 
"react-router-redux": "^4.0.7", 
"redux": "^3.6.0", 

私の問題を理解するのに十分ですか？

Answer 1

ソリューションは、ファイルへの全体ではなく、状態を参照して動作するように減速コードを変更することです：

case "EDIT_FILE": 
     let files = state.files.slice(0); 
     files[action.payload]['in_edit'] = !files[action.payload]['in_edit']; 

     return Object.assign({}, state, {files:files});