Vue3全局屬性app.config.globalProperties的實現(xiàn)
更新時間:2024年01月15日 10:24:08 作者:小馬甲丫
Vue3中的app.config.globalProperties是一個強大的全局配置功能,允許我們在應用級別設置和訪問屬性,本文主要介紹了Vue3全局屬性app.config.globalProperties的實現(xiàn),具有一定的參考價值,感興趣的可以了解一下
一、概念
一個用于注冊能夠被應用內所有組件實例訪問到的全局屬性的對象。點擊【前往】訪問官網(wǎng)

二、實踐
2.1、定義
在main.ts文件中設置app.config.globalPropertie
import {createApp} from 'vue'
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import Pagination from '@/components/Pagination/index.vue';
const app = createApp(App);
//全局方法
app.config.globalProperties.$type = '類型';
app.component('Pagination', Pagination)
app.use(router);
app.use(ElementPlus);
app.mount('#app');
2.2、使用
在Vue文件中使用getCurrentInstance(),通過proxy.$type就可以調用上面定義的方法
<template>
<el-input v-model="proxy.$type" />
<template>
<script setup>
import { getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
console.log(proxy.$type)
</script>
三、最后
到此這篇關于Vue3全局屬性app.config.globalProperties的實現(xiàn)的文章就介紹到這了,更多相關Vue3 app.config.globalProperties內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
element中el-autocomplete的常見用法示例
這篇文章主要給大家介紹了關于element中el-autocomplete的常見用法的相關資料,文中通過實例代碼介紹的非常詳細,對大家學習或者使用element具有一定的參考學習價值,需要的朋友可以參考下2023-03-03

