使用Promise加载图片

使用Promise加载图片

let url = 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fcdn.layui.com%2Favatar%2F54267528.jpg%3Ft%3D1584703923649&refer=http%3A%2F%2Fcdn.layui.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1623497621&t=ecd00470c59def21244456c58dcf7acf'
let uarl2 = 'https: //image.baidu.com/search/detail?ct=503316480&z=undefined&tn=baiduimagedetail&ipn=d&word=tup&step_word=&ie=utf-8&in=&cl=2&lm=-1&st=undefined&hd=undefined&latest=undefined&copyright=undefined&cs=1000551505,2077899926&os=3389568392,421615359&simid=3533858072,288151748&pn=2&rn=1&di=54010&ln=1600&fr=&fmq=1620904916670_R&fm=&ic=undefined&s=undefined&se=&sme=&tab=0&width=undefined&height=undefined&face=undefined&is=0,0&istype=0&ist=&jit=&bdtype=0&spn=0&pi=0&gsm=0&hs=2&objurl=https%3A%2F%2Fgimg2.baidu.com%2Fimage_search%2Fsrc%3Dhttp%253A%252F%252Fac-r.static.booking.cn%252Fimages%252Fhotel%252Fmax1024x768%252F175%252F17552265.jpg%26refer%3Dhttp%253A%252F%252Fac-r.static.booking.cn%26app%3D2002%26size%3Df9999%2C10000%26q%3Da80%26n%3D0%26g%3D0n%26fmt%3Djpeg%3Fsec%3D1623496916%26t%3De899ae028ba6e19f2c923c7fdd4b545b&rpstart=0&rpnum=0&adpicid=0&force=undefined'

function loadImg(src) {
   return new Promise((resolve, reject) => {
      let img = document.createElement('img')
      img.onload = resolve(img)
      img.onerror = reject(`图片加载失败,路径为${src}`)
      img.src = src
   })
}
loadImg(url).then(res => {
  console.log(res);
   return loadImg(uarl2).then(result => {
       console.log(result);
   })
}).catch(err => {
  console.log(err);
})
// 或者
let arr = []
arr.push(url, uarl2)
arr.forEach(ele => {
  loadImg(ele).then(res => {
      console.log(res) // 得到同样的结果  或者Promise.all 全部请求
  })
});