如何将函数导入Vue组件？ [英] How to import a function to a Vue component?

问题描述

我正在尝试将单个函数导入Vue组件。我已经为我的函数创建了一个单独的js文件：

I am trying to import a single function to my Vue component. I've created a separated js file for my function:

randomId.js：

randomId.js:

exports.randomId = () => //My function ...

在我的Vue组件中，我导入了Random js：

In my Vue component, I've imported the Random js:

let randomId = require('../functions/randomId');
randomId();

但是Webpack抛出错误 randomId不是函数。
我尝试使用导入语法导入文件，但错误仍然存​​在。

but Webpack throws an error of "randomId is not a function". I tried to import the file using import syntax, but the error remains.

import randomId from '../functions/randomId';

我应该使用其他一些方法来导入单个函数吗？我对Webpack和JS6相对较新。

Should I use some other methods for importing single functions? I'm relatively new to Webpack and JS6.

推荐答案

更改功能模块以正确使用ES6导出：

Change your function module to properly use ES6 export:

export function randomId() { /*My function ...*/ }

然后使用ES6命名为import：

And then use ES6 named import:

import { randomId } from '../functions/randomId';

这篇关于如何将函数导入Vue组件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！