vue全局函数和属性总结

是谁眉眼2024-08-25 23:37

一、全局函数（不含vue）和数值，公共引入，组件内直接使用

base.js

javascript 复制代码

const userName = function(){
    alert(1)
}

export default{
    userName,
}

main.js

javascript 复制代码

import base from "./base"
Vue.prototype.GLOBALjs = base

使用组件index.vue，直接调用方法或者使用状态

javascript 复制代码

export default {
    data() {
        return {
            a:this.GLOBALjs.a,
this.GLOBALjs.userName()

二、全局函数（不含vue）和数值，组件分别引用

base.js

javascript 复制代码

const userName = function(){
    alert(1)
}

export default{
    userName,
}

index.vue在需要的组件中使用

javascript 复制代码

import GLOBALjs from "@/base.js"
export default {
    data() {
        return {
            a:GLOBALjs.a,

三、全局函数（含vue，公共引入，组件内直接使用

base.js

javascript 复制代码

function packground (param) {
    alert(param)
}

export default {
    install : function (Vue) {
        Vue.prototype.global_function = (param) => packground(param)
    }
}

main.js

javascript 复制代码

import base from "./base"
Vue.use(base);

使用组件

javascript 复制代码

this.global_function('我测试')

四、全局函数（含vue），公共引入，组件内直接使用，简单方法

在main.js中直接写方法