cinnamonandrew

BLOB

Jan 11th, 2021
546
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const fileToDataUri = (file) => new Promise((resolve, reject) => {
  2.     const reader = new FileReader();
  3.     reader.onload = (event) => {
  4.         resolve(event.target.result)
  5.     };
  6.     reader.readAsDataURL(file);
  7. })
  8.  
  9. const Preview = (props) => {
  10.     const [data, setData] = useState()
  11.  
  12.     useEffect(() => {
  13.         props.promise.then(e => setData(e)).catch(e => console.log(e))
  14.     })
  15.  
  16.     return (
  17.         <div className={styles.preview}>
  18.             <img src={data} />
  19.         </div>
  20.     )
  21. }
  22.  
  23. const FileList = (props) => {
  24.  
  25.     return (
  26.         <ul className={styles.fileList}>
  27.             {props.photos.map((e, i) => (
  28.                 <li key={i}>
  29.                     <div className={styles.left}>
  30.                         <Preview promise={e.blobPromise} />
  31.                         <p>{e.name}</p>
  32.                     </div>
  33.  
  34.                     <div className={styles.right}>
  35.                         <button onClick={() => props.onRemove(i)}>Remove</button>
  36.                     </div>
  37.                 </li>))}
  38.         </ul>
  39.     )
  40. }
RAW Paste Data