import { createApp } from 'vue'
import App from './App.vue'

const app = createApp(App);

/** 定義一個(gè)函數(shù)，用于對象鏈?zhǔn)饺≈?*/
const getObjChainingVal = (obj, keyName) => {
  // ...
  return tempObj
}
app.config.globalProperties.getObjChainingVal = getObjChainingVal;

/**定義變量$website，并賦值為devcursor**/
app.config.globalProperties.$website = 'devcursor';

<template>
  <div>
    作者：{{ getObjChainingVal(data, 'user.info.name') }}
    <div>{{ $website }}</div>
  </div>
</template>

<script setup>
import { getCurrentInstance } from 'vue'

const app = getCurrentInstance()
const website = app.appContext.config.globalProperties.$website
console.log(website)

// 或者
const { proxy } = getCurrentInstance()
console.log(proxy.$website)

// 使用解構(gòu)賦值
const { $web } = getCurrentInstance()!.appContext.config.globalProperties
console.log($web)


/**注意！getCurrentInstance()不能在回調(diào)函數(shù)、方法里使用**/
//若要訪問全局變量，需在函數(shù)外面調(diào)用getCurrentInstance()
const { proxy } = getCurrentInstance()
//或者
const name = getCurrentInstance().proxy.$website;
const getUserInfo=()=>{
   console.log(proxy.$website);
   console.log(name);
}

</script>

<script>
export default {
  mounted() {
    console.log(this.$website) // 'devcursor'
  }
}
</script>

import {provide} from "vue";

const data='hello Word';
provide('data',data);

import {inject} from "vue";

const data=inject('data');
console.log(data,'555555555555555555555');   //輸出為：hello Word 

// 之前 (Vue 2.x)
Vue.prototype.$http = () => {}
Vue3：
// 之后 (Vue 3.x)
const app = createApp({})
app.config.globalProperties.$http = () => {}
定義一個(gè)全局變量，示例如下：
app.config.globalProperties.$env = "dev";

app.config.globalProperties.$filters = {
  format<T extends any>(str: T): string {
    return `銜蟬-${str}`;
  }
}