vuejs : "this" 在第 3 方库中是 "undefined"

Question

我的第三方脚本有以下格式的代码

(   function initialMethod(scope, factory) {
        // 'scope' here is UNDEFINED when used in Vue
        // but it is fine in React and Angular
    } (this, function function1(param1) {
              .....
             }       
      )          
    ....    
    function MyMethod() {....}
    ....
)

我使用以下方法从此第三方库导入方法

import {MyMethod} from 'ThirdPartyScript'

当我在 React 或 Angular 中执行此操作时，它工作得很好。

使用 Vue 时失败。 "scope"/"this" 未定义。 示例 Vue 代码

<template>
    <div id="app">
       <p>Hello</p>
    </div>
</template>


<script>
    import {MyMethod} from 'ThirdPartyScript';

    export default {
        name: 'app',        
        created: function () {
          this.initApp();
        },
        methods: {
            initApp: function () {                
                //const myResult = MyMethod();
            } 
    }
</script>

一旦我为第 3 方库包含 "import" 语句（与我从中调用方法时相对），就会出现此错误，因为当我调用 import 语句时，我相信它会执行 "initialMethod" 在它告诉它执行之后有 ()。

为什么这在 Vue 中有所不同？使用 Vue 时是否必须设置不同的内容？

环境信息

我使用 Vue CLI 创建了我的项目，package.json 提到了以下版本

dependencies": {
    "core-js": "^2.6.5",
    "vue": "^2.6.10",        
},
"devDependencies": {
    "@vue/cli-plugin-babel": "^3.11.0",
    "@vue/cli-plugin-eslint": "^3.11.0",
    "@vue/cli-service": "^3.11.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "vue-template-compiler": "^2.6.10"
 },

更新

如果我将第 3 方库中的 "this" 更改为 "window" 我会更进一步，但现在在接下来的调用中

const myResult = MyMethod();

我收到 "MyMethod"

的错误 "Object(...) is not a function"

Answer 1

我终于解决了这个问题。

仅当我的项目中有库的 local 副本时才会出现此问题（我将其与其他 javascript util 文件放在 "scripts" 下).

当我通过将库添加到 package.json/package-lock.json 然后运行 "npm install" 库正确加载时，我不再看到任何错误

package.json

"dependencies": {
    "theLibrary": "https://.......",
    "core-js": "^2.6.5",
    "vue": "^2.6.10",
    "vue-router": "^3.1.3"
},

包-lock.json

"dependencies": {
    ......
    "theLibrary": {
        "version": "https:.....",
         "integrity": ".....
    },
    ......
}

npm 命令

npm install theLibrary

vuejs : "this" 在第 3 方库中是 "undefined"

vuejs : "this" in 3rd party library is "undefined"

javascript

vue.js