【发布时间】：2022-06-10 21:35:40
【问题描述】：
我有一个可以在一个页面上多次使用的 Vue 2 Web 组件（自定义元素）。
因为在 Vue 2 中，全局变量设置为 Vue.prototype.globalVar，两个 Web 组件相互覆盖了全局变量。
比如web组件最终是这样使用的：
<my-webcomponent config="yellow"></my-webcomponent>
<my-webcomponent config="blue"></my-webcomponent>
现在我将传递的配置保存在一个全局变量中（因为 web 组件包含很多 vue 组件，我不想通过所有 vue 组件传递它）
Vue.prototype.config = config
因为 Vue.prototype 对整个站点都是全局的，所以第二个 Web 组件会覆盖第一个的配置。所以最后两个 Web 组件都有 config="blue"
有没有人知道如何让变量只在当前 Web 组件实例中为全局变量？
【问题讨论】：
-
不能使用道具吗？全局配置的目标是什么？如果不是全局设置和使用数据，那么我觉得 props 是要走的路。
-
我会说这是一个 JavaScript 问题，而不是 Web 组件问题。
标签： vue.js vuejs2 web-component custom-element