vue3的全局变量的声明和使用

充电榴莲

已于 2022-11-29 18:44:44 修改

阅读量1.6k

点赞数

分类专栏： Vue3 文章标签： vue.js javascript 前端

于 2022-11-29 18:43:45 首次发布

本文链接：https://blog.csdn.net/weixin_56857645/article/details/128103084

版权

Vue3 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文介绍了如何在Vue3中设置全局变量$hostIP，并在组件中通过getCurrentInstance()获取并验证该值。通过实例演示了如何在setup钩子中结合mounted生命周期函数使用全局变量。

摘要由CSDN通过智能技术生成

设置vue3的全局变量

main.ts或者main.js文件：

import { createApp } from 'vue'
import App from './App.vue'

const app = createApp(App)
//设置全局变量
app.config.globalProperties.$hostIP = "192.168.0.2"

app.mount('#app')

vue页面：


<script>
import {defineComponent,getCurrentInstance,onMounted } from 'vue';
export default defineComponent({
	//data methods create mounted的合体
    setup(){
    	   //最开始默认执行
            onMounted(()=>{
             const Message = getCurrentInstance().appContext.config.globalProperties.$hostIP
			 console.log(Message);//控制台输出验证

            });
    }
})

</script>