最直接的替换就是app.config.globalProperties. See:
https://vuejs.org/api/application.html#app-config-globalproperties https://vuejs.org/api/application.html#app-config-globalproperties
So:
Vue.prototype.$myGlobalVariable = globalVariable
becomes:
const app = createApp(RootComponent)
app.config.globalProperties.$myGlobalVariable = globalVariable
这仅限于特定应用程序，而不是像以前那样是全局的Vue.prototype。这是设计使然，所有“全局”配置选项现在都仅限于应用程序。
相关的RFC在这里：
https://github.com/vuejs/rfcs/blob/master/active-rfcs/0009-global-api-change.md https://github.com/vuejs/rfcs/blob/master/active-rfcs/0009-global-api-change.md
属性添加到globalProperties将通过应用程序中所有组件的组件实例可用。因此，如果您使用 Options API，您将能够使用以下方式访问它们this.$myGlobalVariable，就像你可以用Vue.prototype。它们也可以在模板中使用，无需this., e.g. {{ $myGlobalVariable }}.
如果您使用的是 Composition API，那么您仍然可以在模板中使用这些属性，但您将无法访问模板中的组件实例setup，因此无法在那里访问这些属性。
虽然黑客涉及getCurrentInstance()可以用来访问globalProperties within setup，这些黑客攻击涉及使用未记录的 API，因此不推荐使用这种方法。
相反，应用程序级别provide/inject（也在该 RFC 中讨论）可以用作替代Vue.prototype:
const app = createApp(RootComponent)
app.provide('myGlobalVariable', globalVariable)
在后代组件中，可以使用以下方式访问它inject。例如和<script setup>:
<script setup>
import { inject } from 'vue'
const myGlobalVariable = inject('myGlobalVariable')
</script>
或者用明确的setup功能：
import { inject } from 'vue'
export default {
setup() {
const myGlobalVariable = inject('myGlobalVariable')
// Expose it to the template, if required
return {
myGlobalVariable
}
}
}
或者使用选项 API：
export default {
inject: ['myGlobalVariable']
}
Docs: https://vuejs.org/api/application.html#app-provide https://vuejs.org/api/application.html#app-provide
这里的想法是组件可以显式声明属性而不是通过魔法继承它。这可以避免诸如名称冲突之类的问题，因此无需使用$字首。它还可以帮助您更清楚地了解财产的确切来源。
常见的是inject要包装在可组合项中的函数。例如，useRouteVue Router 公开的可组合项只是一个包装器inject.
此外globalProperties and provide/inject，还有各种其他技术可以用来解决与以下相同的问题Vue.prototype。例如，ES 模块、store，甚至全局 mixin。这些不一定是对此处发布的具体问题的直接答案，但我在以下位置更详细地描述了各种方法：
https://skirtles-code.github.io/vue-examples/patterns/global-properties.html https://skirtles-code.github.io/vue-examples/patterns/global-properties.html
您喜欢哪种方法取决于您的具体情况。
