programing

redux-thunk와 redux-promise의 차이점은 무엇입니까?

stoneblock 2023. 2. 23. 22:00

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