Question

这是一个伪代码来说明我的问题。当脚本运行时，它将遇到错误func1未定义。我怎么能这样做呢？

app.js

require ('./helper');
new Vue ({
el: "#app",

created: function () {
func1()
}
});

helper.js

module.exports = function () {
  $.notify('Hi', {
    position: "bottom right",
    className: "success"
  });
};

提前致谢！

Answer 1

您可能必须将导入的函数保存到app.js文件中的变量。这取决于您使用的捆绑包（例如browserify或webpack或其他）。在您传递给Vue的参数对象之外声明的函数应该是可访问的：

// app.js
var func1 = require('./helper');
new Vue ({
    el: "#app",

    created: function () {
        func1();
    }
});

在你的helpers.js中，你需要一个对jQuery的引用。您可以包含库（jQuery和$将在window对象上全局使用），或者如下例所示，从https://www.npmjs.com/package/jquery安装并捆绑它你自己的代码。

// helper.js
var $ = require('jquery');

module.exports = function () {
    $.notify('Hi', {
        position: "bottom right",
        className: "success"
    });
};

Answer 2

如果要在多个组件的创建方法中调用此函数，可以创建一个mixin，然后将其传递给特定组件。

//YourMixin.js
new Vue({
  created: function () { ... }
})

//Component
let mixin = require('YourMixin')

new Vue({
  mixins: [mixin],
  ...
})

如何调用Vuejs实例声明的函数？

2 个答案: