问答题4题:vue3中怎么设置全局变量?

难度:
更新时间:2022-05-12

参考答案:

方法一 config.globalProperties

vue2.x挂载全局是使用 Vue.prototype.$xxxx=xxx 的形式来挂载,然后通过 this.$xxx来获取挂载到全局的变量或者方法。

这在 Vue 3 中,就等同于 config.globalProperties。这些 property 将被复制到应用中作为实例化组件的一部分。

1// 之前 (Vue 2.x) 2Vue.prototype.$http = () => {} 3 4// 之后 (Vue 3.x) 5const app = createApp({}) 6app.config.globalProperties.$http = () => {}

方法二 Provide / Inject

vue3新的 provide/inject 功能可以穿透多层组件,实现数据从父组件传递到子组件。

可以将全局变量放在根组件的 provide 中,这样所有的组件都能使用到这个变量。

如果需要变量是响应式的,就需要在 provide 的时候使用 ref 或者 reactive 包装变量。

预览

小程序刷题更方便

预览

关注公众号获取最新面经

预览

加面试交流群

赞赏支持

预览

题库维护不易,您的支持就是我们最大的动力!