While there isn't a standard way of doing this in ES6, there is a library called Bluebird to handle this.
There is also a recommended way described as part of the react documentation. It looks similar to what you have in your 2 and 3rd updates.
const makeCancelable = (promise) => {
let hasCanceled_ = false;
const wrappedPromise = new Promise((resolve, reject) => {
promise.then((val) =>
hasCanceled_ ? reject({isCanceled: true}) : resolve(val)
);
promise.catch((error) =>
hasCanceled_ ? reject({isCanceled: true}) : reject(error)
);
});
return {
promise: wrappedPromise,
cancel() {
hasCanceled_ = true;
},
};
};
const cancelablePromise = makeCancelable(
new Promise(r => component.setState({...}}))
);
cancelablePromise
.promise
.then(() => console.log('resolved'))
.catch((reason) => console.log('isCanceled', reason.isCanceled));
cancelablePromise.cancel(); // Cancel the promise
Taken from: https://facebook.github.io/react/blog/2015/12/16/ismounted-antipattern.html
'링크모음 > React' 카테고리의 다른 글
리엑터 패턴 모아놓은 곳 (0) | 2017.11.11 |
---|---|
리엑트 네이티브 애니메이션 튜터리얼 (0) | 2017.11.06 |
리엑트 네이티브 스위프트 모듈 (0) | 2017.08.25 |
RN 러닝 링크 모음 (0) | 2017.08.13 |
리엑티브 네이티브 계산기 예제 1 (0) | 2017.08.11 |