为什么我的函数在调用时没有定义？

Question

我正在尝试使用 JS SDK 在 Dropbox 上上传文件。这是我尝试调用函数的 html 代码：

<!DOCTYPE html>
<html>
<head>
    <script src="get_from_cin7.js"></script>
    <meta charset="utf-8" />
    <title>Dropbox JavaScript SDK</title>
    <!--<link rel="stylesheet" href="/styles.css">-->
</head>
<body>
    <form onSubmit="Dropupload()">
        <input type="file" id="file-upload" />
        <button type="submit">Submit</button>
      </form>
</body>
</html>

这是定义函数的文件

import { Dropbox } from 'dropbox';

const dbx = new Dropbox({
    accessToken: '<ACCESS TOKEN>', //I replaced it with my access token in the code
    fetch
});

function Dropupload() {
    var file = fileIput.files[0];
    dbx.filesUpload({path: '/' + file.name, contents: file})
    .then(function(response) {
        var results = document.getElementById('results');
        results.appendChild(document.createTextNode('File uploaded!'));
        document.write('MISSION COMPLETE');
      })
      .catch(function(error) {
        console.error(error);
        document.write('BETTER LUCK NEXT TIME');
      });
}

仍然，由于某种我不知道的原因，无法调用我的函数。我收到错误“ReferenceError: Dropupload is not defined”，我不知道这是否与问题有关，但我收到另一个错误：“SyntaxError: import declarations may only appear at top level of a module”

我只是要测试上传，所以这就是现在的全部代码。

这里到底是什么问题？

Answer 1

您在 script 标签中忘记了 type="module"。如果不这样做，ES6 模块语法将无法工作。

您还需要将 Dropupload 附加到 window，否则它是模块本地的。

window.Dropupload = function() {
  var file = fileIput.files[0];
  ...

为什么我的函数在调用时没有定义？

Why is my function not defined when it's called?

javascript

dropbox