方法一 config.globalProperties
vue2.x
挂载全局是使用Vue.prototype.$xxxx=xxx
的形式来挂载,然后通过this.$xxx
来获取挂载到全局的变量或者方法。这在
Vue 3
中,就等同于config.globalProperties
。这些property
将被复制到应用中作为实例化组件的一部分。
// 之前 (Vue 2.x)
Vue.prototype.$http = () => {}
// 之后 (Vue 3.x)
const app = createApp({})
app.config.globalProperties.$http = () => {}
方法二 Provide / Inject
vue3新的
provide/inject
功能可以穿透多层组件,实现数据从父组件传递到子组件。可以将全局变量放在根组件的
provide
中,这样所有的组件都能使用到这个变量。如果需要变量是响应式的,就需要在
provide
的时候使用ref
或者reactive
包装变量。