redux-thunk와 redux-promise의 차이점은 무엇입니까?
제가 알고 있는 바로는 redux-thunk는 액션 자체에서 비동기 함수와 디버깅 값을 디스패치하는 데 도움이 되는 미들웨어입니다.단, redux-promise를 사용하면 비동기 함수를 만들 수 있는 것은 액션 자체 메커니즘을 구현하지 않으면 액션에서 플레인 오브젝트만 디스패치하는 예외입니다.
이 두 패키지의 주요 차이점은 무엇입니까?두 패키지를 모두 한 페이지 리액트 앱으로 사용하거나 redux-thunk를 고수하면 충분한 장점이 있습니까?
redux-thunk
하면 액션 할 수 .
function myAction(payload){
return function(dispatch){
// use dispatch as you please
}
}
redux-promise
과 같은 할 수 .
function myAction(payload){
return new Promise(function(resolve, reject){
resolve(someData); // redux-promise will dispatch someData
});
}
두 라이브러리 모두 작업을 비동기 또는 조건부로 디스패치해야 할 경우 유용합니다. redux-thunk
에서는, 1개의 액션 작성자내에서 복수의 디스패치를 실시할 수도 있습니다.어느 쪽을 선택하든지, 어느 쪽을 선택하든지, 어느쪽이든, 고객의 요구나 스타일에 따라서 다릅니다.
앱에서 두 가지를 함께 사용하고 싶어하거나 필요로 할 수 있습니다.우선 reduces-promise를 사용하여 일상적인 약속 생성 비동기 작업을 수행한 후 복잡성이 증가함에 따라 Thunks(또는 Sagas 등)를 추가할 수 있도록 확장하십시오.
- 삶이 단순하고, 단지 하나의 약속을 돌려주는 크리에이터와 기본적인 비동기 작업을 하고 있을 때,
redux-promise
간단히 되었을 때 '풀기'를그 결과물을 그 가 처리해 .(간단히 말하면, 약속이 해결되었을 때 '포장 해제'를 생각하고, 그 결과를 작성/배포하는 대신, redux-promise(-middleware)는 지루한 모든 것을 처리해 줍니다.) - 그러나 다음과 같은 경우에는 생활이 더욱 복잡해집니다.
- 액션 크리에이터가 여러 가지 약속을 만들고 싶어할 수도 있습니다.또, 이러한 약속을 삭감하는 개별의 액션으로서 송신하고 싶은 경우도 있습니다.
- 또는 결과를 디스패치하는 방법과 장소를 결정하기 전에 관리해야 할 복잡한 전처리 및 조건부 로직이 있습니까?
이 경우 의 이점은 작업 생성자 내부의 복잡성을 캡슐화할 수 있다는 것입니다.
그러나 Thunk가 약속을 생성하고 발송하는 경우 두 라이브러리를 함께 사용해야 합니다.
- 퉁크는 원래의 액션을 구성해, 그것들을 디스패치 합니다.
redux-promise
다음으로 Thunk에 의해 생성된 개별 약속을 리덕터에서 개봉하여 그에 수반되는 보일러 플레이트를 회피합니다(대신 Thunks에서 모든 작업을 수행할 수 있습니다).promise.then(unwrapAndDispatchResult).catch(unwrapAndDispatchError)
은 왜?)★★★★★★★★★★★★★★★★)
사용 사례의 차이를 요약하는 또 다른 간단한 방법은 Redux 작업 사이클의 시작과 종료입니다.
- 복잡한 액션을 작성하거나 괴상한 액션 작성 로직을 캡슐화하여 컴포넌트에서 배제하고 Reducer에서 완전히 배제하는 경우 Redux 흐름의 시작을 위한 것입니다.
redux-promise
모든 것이 단순한 약속으로 요약되고 나면, 당신은 단지 그것들을 개봉하여 그들의 해결/확실한 가치를 스토어에 저장하기를 원할 뿐이다.
주의/참조:
redux-promise-middleware
의 이면에 하고 알기 쉽게 .redux-promise
하고 있고, 잘redux-promise-reducer
.- 복잡한 동작을 구성/시퀀스하기 위해 사용할 수 있는 추가적인 유사한 미들웨어가 있습니다: 매우 인기 있는 것은 다음과 같습니다.
redux-saga
와 매우 유사합니다.redux-thunk
단, 제너레이터 함수의 구문을 기반으로 합니다.한 번 '아까', '아까', '아까', '아까', '아까', '아까', '아까', '아까', '아까', '아까', '아까', '', '아까', '아까', '아까', '아까', '아까'와redux-promise
사가는 수 톤의 보일러 플레이트로 포장을 풀고 수작업으로 가공할 필요가 없는 약속을 만들어내기 때문입니다. - 다음은 thunk 및 redux-promise-middleware를 포함한 다양한 비동기 구성 옵션을 직접 비교한 기사입니다.(TL;DR: "Redux Promise Middleware는 다른 옵션과 비교하여 보일러 플레이트를 대폭 줄입니다."...Saga는 좀 더 복잡한 애플리케이션(읽기: "사용")을, Redux Promise Middleware는 그 외 모든 것을 좋아합니다." )
- 여러 액션을 디스패치할 필요가 있다고 생각되는 중요한 경우가 있지만 실제로는 디스패치하지 않고 심플한 것을 유지할 수 있습니다.즉, 하나의 비동기 호출에 대해 복수의 리덕터가 반응하는 것만으로, 복수의 리덕터에 복수의 액션을 디스패치 하는 경향이 있습니다.그러나 여러 환원 장치가 단일 작업 유형을 모니터링하지 못할 이유는 없습니다.팀원들에게 이 규칙을 사용하고 있다는 것을 확실히 알려주면 팀원들은 (관련된 이름을 가진) 하나의 리듀서만이 특정 작업을 처리할 수 있다고 생각하지 않을 것입니다.
완전 공개:저는 Redux 개발에 대해 비교적 초보적인 사람이라 이 문제에 대해 스스로 고민하고 있습니다.제가 찾은 가장 간결한 답변을 다시 설명하겠습니다.
RedxPromise는 액션이 디스패치되면 payload로 약속을 반환합니다.그러면 RedxPromise 미들웨어는 그 약속을 해결하고 그 결과를 리듀서에 전달합니다.
한편 RedxTunk는 액션크리에이터가 디스패치가 호출될 때까지 실제로 액션오브젝트를 리듀서에 디스패치하는 것을 보류하도록 강제합니다.
여기 이 튜토리얼에 대한 링크가 있습니다.https://blog.tighten.co/react-101-part-4-firebase 。
언급URL : https://stackoverflow.com/questions/36577510/what-is-the-difference-between-redux-thunk-and-redux-promise
'programing' 카테고리의 다른 글
"Warning: useLayoutEffect does nothing on server?"를 수정하는 방법 (0) | 2023.02.23 |
---|---|
word press get_option이 false를 반환함 (0) | 2023.02.23 |
Visual Studio 코드 포맷 변경(React-JSX) (0) | 2023.02.23 |
Visual Studio 코드의 JSX 또는 HTML 자동 완성 (0) | 2023.02.23 |
장치 테스트 시 종속 서비스 주입 AngularJS 서비스 (0) | 2023.02.23 |