时间戳

首页 > 解决方案 > 为什么控制台给出错误：无法导入空路径？

javascript - 为什么控制台给出错误：无法导入空路径？

问题描述

<!DOCTYPE html>
<html>
  <head>
    <title>Parcel Sandbox</title>
    <meta charset="UTF-8" />
  </head>
  <body>
    <div><img alt="no photo" src="" /></div>

    <script>
      const myImage = document.querySelector("img");

      let myReq = new Request("903178.jpg");

      fetch(myReq)
        .then(response => {
          console.log(response); //*no output in console*
          return response.blob();
        })
        .then(response => {
          let objectURL = URL.createObjectURL(response);
          myImage.src = objectURL;
        });
    </script>
  </body>
</html>

我已从同一文件夹中获取图像以在 html 页面上呈现，但错误显示在控制台中

错误：无法导入空路径 CodeSandBox 链接 - https://codesandbox.io/s/hardcore-river-re84i?file=/index.html

标签： javascript

解决方案

根据您提供的代码和框代码，问题是您在图像中添加了一个空的 src="" 。要使代码正常工作，您需要做的就是不给它初始 src 或在其中放入一些东西，例如src="#"

<body>
<div><img alt="no photo" /></div>

<script>
  const myImage = document.querySelector("img");
  let myReq = new Request("903178.jpg");

  fetch(myReq)
    .then(response => {
      return response.blob();
    })
    .then(response => {
      let objectURL = URL.createObjectURL(response);
      myImage.src = objectURL;
    });
</script>

推荐阅读