vue3的 setup中是获取不到this的,为此官方提供了特殊的方法,让我们可以使用this,达到我们获取全局变量的目的。

1. 建立useCurrentInstance.ts

import { ComponentInternalInstance, getCurrentInstance } from 'vue';
// 添加断言
export default function useCurrentInstance(){
    const { appContext } = getCurrentInstance() as ComponentInternalInstance;
    const proxy =appContext.config.globalProperties;
    return { proxy }
}

2. main.js中定义我们的全局变量

import { ElMessage } form "elementPlus"
app.config.globalProperties.$message = ElMessage;

3. 页面中使用

import useCurrentInstance from "../useCurrentInstance";
const { proxy } = useCurrentInstance();
proxy.$message({type:"warning",message:"请输入密码"})

Logo

前往低代码交流专区

更多推荐