Redux-saga 및 Forward/Backward 기회

Question

키오스크 애플리케이션 (사용자 인터페이스)을 개발했으며 다양한 지불 시나리오를 설명해야합니다.

UI 요소를 설명하기 위해 React가 선택되었습니다. 데이터 흐름의 한 방향으로 Redux를 좋아했습니다. 그러나이 아키텍처에서는 비즈니스 로직을 다른 워크 플로를 설명하는 위치를 알지 못했습니다. 연구 결과 훌륭한 모듈 인 redux-saga를 발견했습니다. 나는이 모듈이 프로세스 관리자와 같을 수 있다는 것을 이해했으며, 많은 사람들이 이와 같이 생각한다는 것을 알았다.

하지만 redux-saga는 모두 내가 원하는만큼 명확하지 않으므로 여기에 내 질문을 씁니다.

주요 작업에는 단계가있는 큰 워크 플로우가 있다고 생각합니다. 예를 들어, 프로세스 - 전화 번호로 셀룰러를 지불합니다. 그것은 다음과 같을 것 : 휴대

프로세스 지불 :

• 입력 전화 번호를

• 온라인 수표 번호

  • 나쁜 응답 : 오류

    • 뒤로 : p를 입력하십시오. 연마 할 수

• 확인 정보

• 현금

• 지불에게 확인을 넣어

  • 나쁜 응답 : 오류

    • 뒤로 : 내 비전에서 거래

    에 대한

정보 세포 프로세스 납부가 종료 모든 단계가 이전 단계에서 호출하는 무용담이다. 예를 들어 확인에서 전화 번호 입력과 같은 이전 단계로 이동할 기회를 사용자에게 줄 필요가있을 때까지는 모두 멋지다.

내 메인 워크 플로에서 스테이지를 관리하는 방법에 대해 궁금한 점이 있습니다. 한 단계에서 다른 단계로 전달하고 돌아갈 수 있다면 어떻게해야합니까?

답변 해 주셔서 감사합니다.

Answer 1

redux-saga-examples의 "마법사"예를 확인하십시오.

데모 : http://kuy.github.io/redux-saga-examples/wizard.html
코드 : https://github.com/kuy/redux-saga-examples/tree/master/wizard

이 예제는 3 마법사 페이지가 "시작", "확인"및 "지불". "확인"단계는 "시작"단계에서 주어진 이메일 주소를 확인하는 확인 단계입니다. 확인에 성공하면 마법사가 "지불"단계로 전달합니다. 그렇지 않으면 "시작"단계로 돌아갑니다.

정상적인 흐름 외에도 수동으로 확인 (5 초 소요)하는 동안 "확인"단계에서 "시작"단계로 되돌아 갈 수 있습니다. "시작"단계로 돌아 가면 진행중인 확인 프로세스가 취소됩니다.