javascript - ReactJS - 外部 JS 函数 “is not a function”

标签 javascript reactjs

Orignal Link

我正在尝试调用我的第 3 方要求我包含的外部 JS 函数,以便使用他们的 API,但无法按预期工作。

根据我读到的内容,我应该在包含 extFn() 的 index.html 中包含外部 JS 后使用 window.extFn() ,如下所示

...并且应该像这里的回答一样使用它:从 react 组件调用外部Javascript函数,无论所述函数是在文件内部还是简单地在index.html部分中定义。这适用于我为测试而创建的 JS 文件。

//File: test.js
function test() {
    return "Hello";
}

...像往常一样导入带有 script 标签的 JS 文件,并在我的 React 组件的 render() 中使用 console.log(window.test()) 返回 Hello。

我尝试将导入从 body 移至 HTML head,反之亦然,但我仍然遇到的错误是:

TypeError: window.extFn is not a function
QuickCheckout.render

    ....
      22 |    }
      23 | 
      24 |    render() {
    > 25 |        window.extFn({
      26 |            
    View compiled
    ▶ 20 stack frames were collapsed.

当我查看浏览器控制台时,由于某种原因我有(这似乎是关键问题)

Uncaught SyntaxError: Unexpected token <                                     external.js:1

上面的 test.js 文件在我的实验中有效,生成 Unexpected token < error以及在我的控制台中...

从本地源导入JS:

<script type="text/javascript"language="javascript"src="../src/external.js"></script>

这是external.js的示例

function Initialize() {
    try {

        if (abc !== null) {

        }

        /*  if
         provide the call backs */
        abcd = new DEGD(
            a,
            b,
            c,
            d
        displayProgress('Initializing web socket...');
    } catch (e) {

        alert("Initialization Failed" + e);
    }
}

最佳答案

可以在chrome devtools中查看源码,检查external.js文件是否导入成功

关于javascript - ReactJS - 外部 JS 函数 “is not a function”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60682374/

相关文章:

javascript - 如何使用 javascript 获取输入字段中的值以在 sharepoint 中进行编辑

javascript - API 调用的 Redux 操作不正确

javascript - 安装express.js应用程序Node.js时出错

javascript - 是否可以在不创建全局变量的情况下对客户端 JavaScript 进行单元测试?

javascript - 使用带有嵌套样式的样式组件用于 React 搜索栏,尝试将两个不同的 SVG 放置在搜索栏的相对两侧

javascript - 如果在指令中找不到 Controller ,AngularJS 将忽略要求

javascript - Uncaught TypeError : _this. props.onSubmit 在使用 redux-form 时不是一个函数

javascript - React MUI Multiple Select with Checkboxes not Check marking Initial Selected Options

reactjs - Redux-observable:史诗般的 Jest 测试失败

javascript - 如何在reactjs中将子项追加到光标位置