43 lines
800 B
JavaScript
43 lines
800 B
JavaScript
import React from "react";
|
|
|
|
export default class Thumb extends React.Component {
|
|
state = {
|
|
loading: false,
|
|
thumb: undefined,
|
|
};
|
|
|
|
componentDidUpdate(prevProps) {
|
|
if (prevProps.file !== this.props.file) {
|
|
this.setState({ loading: true }, () => {
|
|
let reader = new FileReader();
|
|
|
|
reader.onloadend = () => {
|
|
this.setState({ loading: false, thumb: reader.result });
|
|
};
|
|
|
|
reader.readAsDataURL(this.props.file);
|
|
});
|
|
}
|
|
}
|
|
|
|
render() {
|
|
if (!this.props.file) {
|
|
return null;
|
|
}
|
|
|
|
if (this.state.loading) {
|
|
return <p>loading...</p>;
|
|
}
|
|
|
|
return (
|
|
<img
|
|
src={this.state.thumb}
|
|
alt={this.props.file.name}
|
|
className=""
|
|
height={200}
|
|
width={200}
|
|
/>
|
|
);
|
|
}
|
|
}
|