vue注册全局js方法(让浏览器兼容ES6语法)

最新推荐文章于 2025-11-24 23:20:58 发布

原创最新推荐文章于 2025-11-24 23:20:58 发布 · 1.5k 阅读

2 ·

CC 4.0 BY-SA版权

技术（javascript）专栏收录该内容

114 篇文章

订阅专栏

本文介绍如何在Vue项目中创建并使用全局函数。通过在单独的JS文件中定义ES6模块化的函数，并将其导入到Vue实例中，使得这些函数可以在整个应用中被任意组件调用。具体包括创建全局函数、导入及注册过程。

自己新建一个js文件如test.js

// 这里写全局的ES6语法(ES2015)如果在index.html写个别浏览器不兼容
const publicFunction = {
    // 睡眠
    sleep(d) {
        return new Promise((resolve) => setTimeout(resolve, d))
    }
    // 你也可以定义多个
    xxxxx(a, b, c) {
        retrun a, b, c
    }
}
export default {
    install(vue) {
        if (!vue.$publicFunction) {
            vue.$publicFunction = publicFunction
        }
        vue.mixin({
            created: function() {
                this.$publicFunction = vue.$publicFunction
            }
        })
    }
}

然后去到main.js

import publicFunction from 'xxxx/xxxx/test.js'

Vue.use(publicFunction)

然后来到vue文件调用

this.$publicFunction.sleep(1800)