반응로를 사용하여 미세 정제기 사용하기

Question

반응과 함께 fineuploader를 사용하려고하며 모든 관련 의존성을 설치했습니다. 다음 내가 사용하는 코드입니다 : -

import React, { Component } from 'react' 
 

 
import FineUploaderTraditional from 'fine-uploader-wrappers' 
 
import Gallery from 'react-fine-uploader' 
 

 
import 'react-fine-uploader/gallery/gallery.css' 
 

 
const uploader = new FineUploaderTraditional({ 
 
    options: { 
 
     chunking: { 
 
      enabled: true 
 
     }, 
 
     deleteFile: { 
 
      enabled: true, 
 
      endpoint: '/uploads' 
 
     }, 
 
     request: { 
 
      endpoint: '/uploads' 
 
     }, 
 
     retry: { 
 
      enableAuto: true 
 
     } 
 
    } 
 
}) 
 

 
class UploadComponent extends Component { 
 
    render() { 
 
     return (
 
      <Gallery uploader={uploader} /> 
 
     ) 
 
    } 
 
} 
 

 
export default UploadComponent

그러나 나는 다음과 같은 오류를 얻을 : -

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `Gallery`. 
at invariant (invariant.js?7313:44) 
at instantiateReactComponent (instantiateReactComponent.js?e676:74) 
at instantiateChild (ReactChildReconciler.js?c86a:44) 
at eval (ReactChildReconciler.js?c86a:71) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:77) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:93) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:93) 
at traverseAllChildren (traverseAllChildren.js?5edf:172) 
at Object.instantiateChildren (ReactChildReconciler.js?c86a:70) 
at ReactDOMComponent._reconcilerInstantiateChildren (ReactMultiChild.js?e1f8:185) 

경고 : React.createElement : 유형이 유효하지 않습니다 - 문자열 (기본 제공 구성 요소의 경우) 또는 클래스/함수 (복합 구성 요소의 경우)가 있지만 : 정의되지 않았습니다. 구성 요소를 정의한 파일에서 내보내는 것을 잊었을 가능성이 큽니다. `갤러리 '의 렌더링 방법을 확인하십시오. (UploadComponent에 의해 만들어진) 갤러리에서

UploadComponent

에서 나는이 fineuploader 문서를 반응 다음 봤는데 몇 가지 다른 일을 시도했지만 아무것도 작동하는 것 같다 없습니다.

Answer 1

문제 내부 Gallery를 wraping하려고 내 사건에 있던 일부 충족되지 않은 의존성이다 했다

react-transition-group@2.x 

2.x를 제거하고 1.2.1을 설치하면 문제가 해결됩니다.

구성하려는 패키지의 설치 종속성에 유의하십시오.

반응이 좋은 업로드 소유자 rnicholus에게 도움을 주심으로써 감사합니다.

Answer 2

모듈에서 Gallery 구성 요소를 가져와야한다고 생각합니다.

import Gallery from 'react-fine-uploader'

는

업데이트 :

react-transition-group@1.x 

I : 또한
사업부

class UploadComponent extends Component { 
    render() { 
     return (
      <div> 
      <Gallery uploader={uploader} /> 
      </div> 
     ) 
    } 
}