--- title: 'react報錯：Can‘t perform a React state update on an unmounted component' date: 2021-07-24 11:54:00 ---   解決方案： ```javascript //生成cancelToken，用于取消請求 const getCancelSource = () => { return axios.CancelToken.source() } //掛載時異步獲取所屬分類數據 useEffect(() => { const source = getCancelSource() Api.light.category(source.token).then((res) => { if (res.state === 1) { const category = formatCategory({ categoryOptions: res.data }) setCategoryOptions(category) console.log('category') } }).catch(err => { console.log(err) }) return () => { console.log('卸載') source.cancel() } }, []) ```   參考鏈接：[http://www.axios-js.com/zh-cn/docs/#%E5%8F%96%E6%B6%88](http://www.axios-js.com/zh-cn/docs/#%E5%8F%96%E6%B6%88) ```javascript const CancelToken = axios.CancelToken; const source = CancelToken.source(); axios.get('/user/12345', { cancelToken: source.token }).catch(function(thrown) { if (axios.isCancel(thrown)) { console.log('Request canceled', thrown.message); } else { // 處理錯誤 } }); axios.post('/user/12345', { name: 'new name' }, { cancelToken: source.token }) // 取消請求（message 參數是可選的） source.cancel('Operation canceled by the user.'); ``` axios config的一個字段： ```javascript // `cancelToken` 指定用于取消請求的 cancel token // （查看后面的 Cancellation 這節了解更多） cancelToken: new CancelToken(function (cancel) { }) ```