警告：setState（...）：無法在反應過程中的現有狀態轉換期間更新

當我單擊按鈕時，我總是會收到警告。我搜索它，他們使用綁定來移除警告，但我怎麼可以添加它來反應在我的代碼綁定功能的redux？警告：setState（...）：無法在反應過程中的現有狀態轉換期間更新

import * as React from 'react'; 
import {connect} from 'react-redux'; 
import {toggleModal} from '../../actions/ModalActions'; 

interface Props { 
    show?: boolean; 
    onSelectedSample: (value: boolean) => void; 
} 

const SampleList = ({show, onSelectedSample}: Props) => { 

    return (
    <div> 
     <a className='button link info' onClick={() => onSelectedSample(!show)}><i className='fa fa-user-plus fa-fw'></i></a> 
     <a className='button link info' onClick={() => onSelectedSample(!show)}><i className='fa fa-user-plus fa-fw'></i></a> 
     <a className='button link info' onClick={() => onSelectedSample(!show)}><i className='fa fa-user-plus fa-fw'></i></a> 
     </div> 
    ); 
}); 


const mapStateToProps = (state, props) => { 
    return { 
     show: state.modalReducer.show, 
    }; 
}; 

const mapDispatchToProps = (dispatch, props) => { 
    return { 
     onSelectedSample: (toggle: boolean){ 
      dispatch(toggleModal(toggle)); 
     }, 
    }; 
}; 

const ListSampleContainer = connect(mapStateToProps, mapDispatchToProps)(SampleList); 
export default ListSampleContainer;

在redux代碼中很難。我不知道如何在redux中處理這個問題。

更新

Actions文件夾

import {ModalActions} from '../constants/ModalConstants'; 

export const toggleModal = (show?: boolean) => { 
    return { 
     type: ModalActions.TOGGLE_MODAL, 
     show, 
    }; 
};

減速夾

import {ModalActions} from '../constants/ModalConstants'; 

interface State { 
    show: boolean; 
} 

const initState = {show: false}; 

export const modalReducer = (state: State = initState, action) => { 
    switch (action.type) { 
     case ModalActions.TOGGLE_MODAL: 
      if (action.show) { 
       return {show: action.show}; 
      } else { 
       return {show: !state.show}; 
      } 

     case ModalActions.HIDE_MODAL: 
      return {show: false}; 
    } 
    return state; 
};

如果我只有一個按鈕。我沒有警告，但添加了更多按鈕。那將會發生

來源

2017-04-25 user3818576

您使用了關鍵字'interface' ...它不是真的js嗎？ –

.tsx（打字稿） – user3818576

減速機中的toggleModal的結果是什麼？ –

也許當你點擊一個錨時，其他人會以某種方式點擊，因爲它們是交錯的。爲了消除這種可能性，請嘗試爲不同的錨定使用不同的onClick處理程序，並查看是否仍然存在錯誤。例如，讓他們中的每一個都向控制檯記錄不同的輸出，而不是調度您的操作。那麼我們肯定會知道。

<a className='button link info' onClick={() => onSelectedSample1(!show)}><i className='fa fa-user-plus fa-fw'></i></a> 
<a className='button link info' onClick={() => onSelectedSample2(!show)}><i className='fa fa-user-plus fa-fw'></i></a> 
<a className='button link info' onClick={() => onSelectedSample3(!show)}><i className='fa fa-user-plus fa-fw'></i></a>

來源

2017-04-25 03:43:54

警告：setState（...）：無法在反應過程中的現有狀態轉換期間更新

回答

相關問題