vue3全局变量挂载
image.png
vue3是用globalProperties这个属性来挂载全局变量的。
挂载完后在文件中使用
template中直接调用
image.png
script中传统方法下使用跟以前一样
image.png
script中setup语法糖下使用，由于setup没有this，所以需要导入获取当前实例的方法，解构到proxy来使用
image.png
可以把proxy变量理解为原来的this
可以看到上面变量test引用爆红了，因为ts类型检测到proxy下没有test变量，要解决这个问题需要在写一个声明文件来扩展vue的接口
如果项目中没有现成的声明文件可以使用的话，可以自己创建一个，我在src下创建了一个叫typing.d.ts的声明文件
image.png
自己添加的声明文件，需要在tsconfig.json或jsconfig.json里配置一下，在include里把文件完整路径加上
image.png
这样声明文件才能生效，如果用的是项目里已经存在并且引入了的声明文件，可以忽略这一步
最后在声明文件里定义如下，类型设置为any是图方便，可以设置为自定义的interface
image.png
扩展全局变量的接口内容，需要扩展ComponentCustomProperties这个接口，不要乱改成别的
注意，扩展vue的接口需要先import vue进来
image.png
不导入原来的环境进来，直接扩展的话，就不是扩展了，变成覆盖，自己可以试试不import会怎么样
扩展完毕，不再报错
image.png
