image.ts 963 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. interface ImageSize {
  2. width: number;
  3. height: number;
  4. }
  5. // 获取图片的原始宽高
  6. export const getImageSize = (src: string): Promise<ImageSize> => {
  7. return new Promise(resolve => {
  8. const img = document.createElement('img')
  9. img.src = src
  10. img.style.opacity = '0'
  11. document.body.appendChild(img)
  12. img.onload = () => {
  13. const imgWidth = img.clientWidth
  14. const imgHeight = img.clientHeight
  15. img.onload = null
  16. img.onerror = null
  17. document.body.removeChild(img)
  18. resolve({ width: imgWidth, height: imgHeight })
  19. }
  20. img.onerror = () => {
  21. img.onload = null
  22. img.onerror = null
  23. }
  24. })
  25. }
  26. // 获取图片文件的dataURL
  27. export const getImageDataURL = (file: File): Promise<string> => {
  28. return new Promise(resolve => {
  29. const reader = new FileReader()
  30. reader.addEventListener('load', () => {
  31. resolve(reader.result as string)
  32. })
  33. reader.readAsDataURL(file)
  34. })
  35. }