尝试使用react-dropzone组件

时间:2015-09-11 15:29:46

标签: javascript reactjs

我正在尝试使用react-dropzone并收到以下错误:

使用:

constructor() {
  super();
  this.state = {};
  this.state['showPartial'] = false;
  this.state['uploadModal'] = false;
  files: [];
} 

onDrop(files) {
  this.setState({
     files: files
  });
}

render() {

    return(

<ModalWindow heading="Upload" align="center" show={this.getModal("uploadModal")}>
  <div>
    <Dropzone ref="dropzone" onDrop={this.onDrop}>
        <div>Try dropping some files here, or click to select files to upload.</div>
    </Dropzone>
    {this.state.files.length > 0 ? <div>
    <h2>Uploading {this.state.files.length} files...</h2>
    <div>{this.state.files.map((file) => <img src={file.preview} /> )}</div>
    </div> : null}
  </div>
  <div className="AddModalFooter">
    <button href="#" className="btn btn-primary">Save</button>
    <button onClick={this.closeModal.bind(this, "uploadModal")} href="#" className="button default">Cancel</button>
  </div>
  <button className="modal-close-button" onClick={this.closeModal.bind(this, "uploadModal")}>
    <i className="fa fa-times"></i>
    </button>
</ModalWindow>
    );
}

我得到的错误:

Uncaught Error: Invariant Violation: ReactMount: Two valid but unequal nodes with the same `data-reactid`: .2cajum28glc.1.1.0.1.0.1.0.0
invariant.js:45

Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's `render` method). Try rendering this component inside of a new top-level component which will hold the ref.

Main.js:79Uncaught TypeError: this.setState is not a function
Unhandled promise rejection TypeError: Cannot read property 'length' of undefined

关于什么错误的想法?感谢

0 个答案:

没有答案