Vue 定义全局变量和函数

---

theme: smartblue

一、参考

学习Vue3 第二十九章(Vue3定义全局函数和变量)_vue3全局函数-CSDN博客

二、全局变量

2.1 定义

``` import { createApp } from 'vue' import './style.css' import App from './App.vue'

export const app = createApp(App)

app.config.globalProperties.$env = 'dev' app.mount('#app')

```

2.2 使用

此时在任意一个组件都可以获取

``` {{ $env }}

```

三、全局函数

3.1 定义

``` import { createApp } from 'vue' import './style.css' import App from './App.vue'

export const app = createApp(App)

app.config.globalProperties.$env = 'dev'

app.config.globalProperties.$sayHi = { say(name:string){ return "hi "+ name } }

app.mount('#app')

```

3.2 使用

``` {{ $env }}
{{ $sayHi.say("xyy") }}

```

四、ts 中使用全局变量和函数

``` {{ $env }}
{{ $sayHi.say("xyy") }}

```

五、问题

调用全局变量和函数时候程序会报错，是因为没有编写申明文件

拓展main.ts

拓展后全局方法没有报错

此时再拓展全局变量

报错消失