88 lines
2.0 KiB
TypeScript
88 lines
2.0 KiB
TypeScript
import React, { Component } from "react";
|
|
import Dropzone from "../../";
|
|
|
|
export class TestReactDragEvt extends Component {
|
|
getFiles = async (event: React.DragEvent<HTMLDivElement>) => {
|
|
const files = Array.from(event.dataTransfer.files);
|
|
return files;
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<Dropzone getFilesFromEvent={this.getFiles}>
|
|
{({ getRootProps }) => <div {...getRootProps()} />}
|
|
</Dropzone>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export class TestDataTransferItems extends Component {
|
|
getFiles = async (event: React.DragEvent<HTMLDivElement>) => {
|
|
const items = Array.from(event.dataTransfer.items);
|
|
return items;
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<Dropzone getFilesFromEvent={this.getFiles}>
|
|
{({ getRootProps }) => <div {...getRootProps()} />}
|
|
</Dropzone>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export class TestNativeDragEventEvt extends Component {
|
|
getFiles = async (event: DragEvent) => {
|
|
const files = Array.from(event.dataTransfer.files);
|
|
return files;
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<Dropzone getFilesFromEvent={this.getFiles}>
|
|
{({ getRootProps }) => <div {...getRootProps()} />}
|
|
</Dropzone>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export class TestChangeEvt extends Component {
|
|
getFiles = async (event: React.ChangeEvent<HTMLInputElement>) => {
|
|
const files = Array.from(event.target.files);
|
|
return files;
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<Dropzone getFilesFromEvent={this.getFiles}>
|
|
{({ getRootProps }) => <div {...getRootProps()} />}
|
|
</Dropzone>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export class TestNativeEvt extends Component {
|
|
getFiles = async (event: Event) => {
|
|
const files = Array.from((event.target as HTMLInputElement).files);
|
|
return files;
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<Dropzone getFilesFromEvent={this.getFiles}>
|
|
{({ getRootProps }) => <div {...getRootProps()} />}
|
|
</Dropzone>
|
|
</div>
|
|
);
|
|
}
|
|
}
|