UIkit.uploadDrop 不是函数（打字稿）答案

【问题标题】：UIkit.uploadDrop is not a function (typescript)UIkit.uploadDrop 不是函数（打字稿）
【发布时间】：2020-03-18 15:31:31
【问题描述】：

我正在使用@types/uikit npm 包并遇到此错误。这是我现在的代码

    UIkit.uploadDrop('.js-upload', {
    action: '',
    single: true,
  } as UIkit.UploadOptions);

【问题讨论】：

标签： typescript uikit next.js

【解决方案1】：

您是否尝试过使用 'next/head' 并将其作为单独的 JS 文件包含在您的页面上，例如 upload.js？

例如，您可以通过这种方式为特定页面加载外部文件：

 import React from "react"
  import Head from 'next/head'
  import MyAwesomeComponent from "../components/mycomponent.js"
  export default () => (
    <div>
      <Head>

        <link type="text/css" rel="stylesheet" href="static/css/chatwidget.css" />
        <link type="text/css" rel="stylesheet" href="static/css/download.css" />

        <script type="text/javascript" src="static/libs/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/malihu-custom-scrollbar-plugin@3.1.5/jquery.mCustomScrollbar.concat.min.js"></script>
        <script type="text/javascript" src="static/libs/bootstrap.min.js"></script>
        <script type="text/javascript" src="static/libs/owl.carousel.min.js"></script>
        <script type="text/javascript" src="static/scripts/chatHead.js"></script>
        <script type="text/javascript" src="static/libs/jquery.magnific-popup.js"></script>
      </Head>

      <MyAwesomeComponent /> {/* a simple React component that returns  : <p>Hello World </p>*/}
    </div>
  )

然后，您可以使用这种方法包含您的 upload.js 文件以及 UIKit 库中的代码，以通过这种方式处理上传。我建议这种方法的原因是因为我花了很多时间试图与 UIkit Typescript 类型作斗争，并且即使组件本身的代码是正确的，也无法超越。我是不是用上面的方法移动了我的 sn-p 来处理上传，一切都很好，开箱即用。

您可以将这个新的 js 文件移动到您的静态目录中，在 Next 8.0+ 之后称为 public。

我知道这并没有具体解决该错误，但它可能会为您提供不同的尝试方法。

【讨论】：