React/react-router가 일련의 URL로 리디렉션합니까?

사용 사례는 내 사용자가 사진 모음을 업로드 할 수 있으며 각 사진 모음은 사용자가 채울 메타 정보 집합과 연결되어야합니다. 따라서 파일 집합을 업로드 한 후 사용자를 다음으로 리디렉션하고 싶습니다. 첫 번째 사진의 메타 편집기 페이지를 열고 "다음"버튼을 클릭하면 두 번째 페이지로 이동합니다.React/react-router가 일련의 URL로 리디렉션합니까?

반응 및 반응 라우터를 사용하여 어떻게 구현해야합니까?

출처

2016-10-01 eddie.xie

이것은 내가 취한 접근법입니다. 모든 그림을 서버에 먼저 업로드하고 업로드 된 모든 사진의 이미지 ID를 저장하는 임시 데이터 구조 또는 새 앨범을 만듭니다. 그런 다음 앨범 ID가있는 새 URL로 리디렉션하십시오. Ex-redirect <domain.com>/album/:id

이 URL (album/: id)을 입력하면 이미지 목록을 쿼리하고 이미지를 반복합니다. URL은 다음과 같을 것입니다 <domain.com>/album/:id/photo/photo_id

심지어 페이스 북에서도 비슷한 기능을합니다. 사용

출처

2016-10-01 05:51:35

저비용 점포에 보관하는 것이 더 쉬울까요? –

먼저 그림을 서버에 업로드 할 때의 이점 중 하나는 URL '/album/: id/photo/photo_id/edit'가 일관성이 있으므로 사진을 CRUD 작업을 수행하기 위해 다시 사용할 수 있다는 것입니다 (사진 ID는 데이터베이스에 생성). 이렇게하면 URL이 딥 링크되고 브라우저의 탐색 버튼이 올바르게 작동합니다. 나는 RESTful 아키텍처를 따르기 때문에이 접근법을 좋아한다. 나는 redux 상점을 사용하여 동일한 작업을 수행하는 것을 생각할 수 없습니다. 즉 사진과 메타 데이터를 한 번에 업로드하십시오. 이 경우 기록이 보존되지 않습니다. 너에게 이해가 되니? –

확실히! 감사! –

react-router v4 새로운 그럴 수있어 쉽게 설치

render() { 
    const { uploadsCompleted } = this.state 

    return (
     <div> 
     {uploadsCompleted && (
      <Redirect to={`/uploads/1`}/> 
     )} 
     <div> 
      {/* Your upload progress info goes in here and is only displayed when the uploads are still in progress. */} 
     </div> 
     </div> 
    ); 
    }

파일 업로드를 처리하고 당신에 후크 할 수 있습니다 당신이 react-fileupload를 사용할 수 업로드 진행 상황을 추적 할 수 있도록처럼 render() 방법에 리디렉션 uploadSuccess 또는 uploading 이벤트를 추적하여 setState 키를 상태 키를 true으로 설정하여 업로드가 완료되면 첫 번째 이미지로 리디렉션하도록해야합니다. 단, 경로를 Match으로 올바르게 설정해야합니다.

출처

2016-10-01 06:00:05 dzv3

React/react-router가 일련의 URL로 리디렉션합니까?

답변

관련 문제