!DOCTYPE htmlhtml head meta charset=utf-8 name=viewport content=width=device-width initial-scale=1 maximum-scale=1 user-scalable=no titleWebCattitle style #preview max-width80;

这段代码有一个问题：在BASE64函数中，返回语句应该在reader.onload函数的外部。因为reader.onload是一个异步函数，它会在文件读取完成后才执行，所以需要将返回语句放在外部，以便获取到正确的结果。

修正后的代码如下：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>WebCat</title>
    <style>
      #preview{
        max-width:80%;
      }
    </style>
  </head>
  <body>    
    <input type="file" />
    <img src="" id="preview" alt=""/>
    <script>
    function BASE64(file){
        return new Promise((resolve, reject) => {
          var reader = new FileReader();
          reader.onload = (e) =>{
            resolve(e.target.result);
          }
          reader.onerror = reject;
          reader.readAsDataURL(file);
        });
      }
      var inp = document.querySelector("input");
      inp.onchange = async function(){
        preview.src = await BASE64(inp.files[0]);
      }
    </script>
  </body>
</html>

这样，当文件选择后，图片会被转换成base64编码，并显示在页面上

!DOCTYPE htmlhtml head meta charset=utf-8 name=viewport content=width=device-width initial-scale=1 maximum-scale=1 user-scalable=no titleWebCattitle style #preview max-width80;