vue组件导入js文件中的函数

可能这个问题对于前端的朋友们来说很简单，但是对于我这个半吊子前端来说着实有点难度，所以我就记录下来了。
我有一个名为dev_helper.js的文件，里面定义了一个函数:

import axios from 'axios'
export function CheckToken()
{
    var token = localStorage.getItem('token')
    if(token === '' || !token)
    {
        return -1;
    }
    else
    {
        var form = new FormData();
        form.append('token', token);
        axios({
            method: "POST",
            url: 'http://localhost:7788/check_token',
            data: form
        }).then(res=>{
            if(res.data.code === 200)
            {
                localStorage.setItem("token", res.data.token);
                return 1;
            }
            else
            {
                return 0;
            }
        })
    }
}

这是一个用LocalStorage进行token校验的函数，不过我们的重点是vue组件导入该函数，所以我们只需要记住在函数前加个export就行了。
然后这是vue组件中的导入代码:

1	import {CheckToken} from "@/dev_helper"

因为我的js文件与vueProject/src/components同级，所以路径用的是@/dev_help。
这样就可以直接在.vue文件中使用CheckToken函数了。

还有一种方法，其实和上面的那一个方法差不多，不过这个有点类似C++中的namespace了。这是js文件中的代码:

import axios from 'axios'
function CheckToken()
{
    var token = localStorage.getItem('token')
    if(token === '' || !token)
    {
        return -1;
    }
    else
    {
        var form = new FormData();
        form.append('token', token);
        axios({
            method: "POST",
            url: 'http://localhost:7788/check_token',
            data: form
        }).then(res=>{
            if(res.data.code === 200)
            {
                localStorage.setItem("token", res.data.token);
                return 1;
            }
            else
            {
                return 0;
            }
        })
    }
}

export const Henv =
    {
        CheckToken
    }

其中重点在最后4行，export const Henv相当于创建了一个叫做Henv的命名空间(不知道这个比喻恰不恰当)，导入的时候只需要导入这个命名空间(即Henv)，然后调用的时候直接Henv.functionName()即可。需要注意的是，export后面的const是必须要加的。
这是vue组件中的代码:

// 导入
import {Henv} from "@/dev_helper"

// 调用
 Henv.CheckToken();

就是这样。
本篇完。