React报错Warning:setState(...):Can only update a mounted or mounting component...

React项目中报错：

实际在调试过程中发现，仅当在页面间快速切换的时候会出现该警告，原因是组件中的setState方法（也有一些setTimeout情况下）是异步执行的，当你在快速切换组件的时候，组件虽然已经被卸载，但是该方法还在异步调用，所以报错

解决方案：

组件将要被卸载的时候，会触发React中的componentWillUnmount方法，该方法是React生命周期的一部分

参考链接：

https://facebook.github.io/react/docs/react-component.html

1、可以声明一个变量，为false，每次执行setState的时候判断下该变量是否为false，在组件将要被卸载的时候，改变该变量为true，如果为true，则所有的setState方法不执行

2、setTimeout可以clear一下

3、ajax请求可以abort终止

例子：

class RoleList extends React.Component{
	
	constructor(props){
		super(props);
		this.state = {
			loading : false
		}
		this.lock = false;
	}

	toggleLoading(){
		if(!this.lock){
			this.setState({
				loading : !this.state.loading
			})
		}
	}

	componentWillMount(){
	}

	//组件将被卸载
	componentWillUnmount(){
		this.lock = true;
	}

	componentDidMount(){
		this.toggleLoading();
	}

	render(){
		return (
			<div className="main-box">
			</div>
		);
	}

}

export default RoleList;