Vue3之config.globalProperties

最新推荐文章于 2025-03-13 17:20:58 发布
最新推荐文章于 2025-03-13 17:20:58 发布
阅读量736 收藏 9
点赞数 7
分类专栏： Vue 文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_63605379/article/details/135361690
版权
本文对比了Vue2和Vue3中管理全局可访问属性的方法变化，着重讲解了如何在Vue3中使用`config.globalProperties`来替代Vue.prototype.$http。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在 Vue 2 中， Vue.prototype 通常用于添加所有组件都能访问的 property。

// 之前 - Vue 2
Vue.prototype.$http = () => {}

在 Vue 3 中与之对应的是 config.globalProperties。这些 property 将被复制到应用中，作为实例化组件的一部分。

// 之后 - Vue 3
const app = createApp({})
app.config.globalProperties.$http = () => {

vue3.0之全局变量app.config.globalProperties的使用
m0_67391401的博客
03-01 3991
globalProperties 类型：[key: string]: any 默认：undefined 用法 添加一个可以在应用的任何组件实例中访问的全局 property。组件的 property 在命名冲突具有优先权。 这可以代替 Vue 2.x Vue.prototype 扩展： // 之前(Vue 2.x) Vue.prototype.$http = () => {} // 之后(Vue 3.x) const app = Vue.createApp({}) app.config.glo
vue 3之app.config.globalProperties的使用，ctx打包后指向错误
MZS_ym的博客
09-29 1万+
vue 3之app.config.globalProperties的使用 在main.js中配置app.config const app = createApp(App) app.config.globalProperties.http = () => { console.log('i am http') } app.use(store).use(router).use(Element3).mount('#app') 当我们想在组件内调用http时需要使用getCurrentInstance
Vue3全局属性app.config.globalProperties
小马甲
01-01 5241
在main.ts文件中设置//全局方法app.config.globalProperties.$type = '类型';本人每篇文章都是一字一句码出来，希望对大家有所帮助，多提提意见。
app.config.globalProperties
最新发布
qq_51528868的博客
03-13 890
是 Vue 3 应用实例（app）的一个配置属性，它允许你在整个应用范围内添加全局可用的属性。将一些常用的工具函数挂载到全局属性上，这样在组件中就可以直接调用这些函数，而无需重复导入。// 创建 Vue 应用实例// 添加全局属性app.config.globalProperties.$mes= '这是一个全局消息';return '这是个全局函数返回的方法'// 挂载应用。
vue3全局属性/方法的创建及使用--app.config.globalProperties(支持ts)
m0_71537867的博客
04-21 9431
有时一些属性值或方法想要在很多个组件中被使用，且想要进行统一管理，此时就可以将这些属性值或方法注册在能够被应用内所有组件实例访问到的对象中。我们将想要全局使用的属性或方法注册在app.config.globalProperties对象中，就可以在应用内的任意组件中使用。
Vue3新增特性 之 全局config.globalProperties和Teleport内置组件
weixin_45092437的博客
01-27 4343
1、在Vue3中，通过`createApp()`方法创造的应用实例会暴露一个 `config` 对象允许我们配置一些应用级的选项，例如全局变量。2、Teleport是 Vue 3 的新增的内置组件，用于将组件内的子节点传输/移动到整个页面 DOM 树的其他DOM节点下。其接收一个 to属性来指定传送的目标。to属性的值可以是一个 CSS 选择器字符串，也可以是一个 DOM 元素对象。
Vue3注册全局属性 (app.config.globalProperties)
weixin_50961467的博客
05-10 1286
app.config.globalProperties：一个用于注册能够被应用内所有组件实例访问到的全局属性的对象。
vue3 全局注册app.config.globalProperties， 如何处理getCurrentInstance 上下文线上环境报错
web18334137065的博客
03-01 1146
vue3挂载全局属性和方法，使用app.config.globalProperties， 但是在组件中获取全局上下文的时候getCurrentInstance会在线上环境报错。 搜索了一遍，看了好多文章，都是在本地环境getCurrentInstance有用，线上环境报错，所以一切的一切还是去官网查找，得到最后的完美结果。 线上环境正确使用： const instance = getCurrentInstance() console.log('instance???', instance.appConte
Vue3之app.config.globalProperties（定义全局变量）
小白的豪豪
07-11 9204
一般我们在vue开发中，常用的功能，接口等等我们都会封装起来，如何每次创建一个组件，想要使用这些封装起来的功能、接口等等都需要先引入，再通过层层调用才可以得到结果，如果我现在一遍需要调用后端接口、验证n种输入框，且这些方法都不在同一个文件当中，我们就需要不断引入，相当麻烦。所以就会想着能否将这些常用的，都存放在一块，需要调用的时候，只需要引入一个，既可得到所有分装起来的功能。
vue3使用全局扩展属性app.config.globalProperties
wangfei0225_的博客
05-16 3311
vue3的全局扩展属性
vue3 中全局变量app.config.globalProperties的使用
虎康的博客
08-14 1232
如图，我们在 Utils.js文件夹下封装了自定义的方法，想要把它们注册到全局都可调用的状态，该怎么做呢？Vue3 中当我们想要把某个自定义方法放在全局，应该如何定义和使用。
vue3之全局变量app.config.globalProperties的使用
热门推荐
samscat的博客
12-15 3万+
在main.js里面配置config const app = createApp(App); app.config.globalProperties.$user = { name: '梅长苏', weapons: '长剑', title: '刺客' } 在template模板中使用 <p>姓名：{{$user.name}} </p> 在setup中使用 const cns = getCurrentInstance() console.log(c.
vue3.0全局变量app.config.globalProperties的使用
qq_42669897的博客
10-12 5927
app.config.globalProperties是一个用于注册能够被应用内所有组件实例访问到的全局属性的对象。是Vue2中Vue.prototype使用的一种替代
vue3之全局方法app.config.globalProperties的使用
致梦Blog
03-16 2573
vue3如何使用app.config.globalProperties定义全局方法！
uni.app:VUE3使用app.config.globalProperties，进行全局方法设置及其引用
weixin_46001736的博客
01-02 1378
uni.app:VUE3使用app.config.globalProperties，进行全局方法设置及其引用
Vue3: 添加全局属性app.config.globalProperties
西魏陶渊明的博客
01-07 1654
使用方式的一种替代，此写法在 Vue 3 已经不存在了。与任何全局的东西一样，应该谨慎使用。如果全局属性与组件自己的属性冲突，组件自己的属性将具有更高的优先级。一个用于注册能够被应用内所有组件实例访问到的全局属性的对象。这是对 Vue 2 中。
vue3 app.config.globalProperties
02-12
在 Vue 3 中，`app.config.globalProperties` 取代了 Vue 2 的 `Vue.prototype` 方法来添加全局可用的属性。这意味着可以在创建应用实例之后通过此方法向所有的组件注入自定义属性或函数。 当插件初始化后，在 Vue ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值