https://blog.csdn.net/lgdaren/article/details/125224122
vue3挂载全局变量 https://blog.csdn.net/csl125/article/details/117432769
import { provide,inject,ref,reactive } from "vue"
provide('info',"值")//设置值
const info = inject('info')//获取值
添加响应性
为了给 provide/inject 添加响应性，使用 ref 或 reactive 。
let info = ref("今天你学习了吗？");
provide('info',info)
//如果在别的页面改了info的值，则所有页面获取info的值马上刷新。
const info = inject('info')
vue3挂载全局变量
在 Vue 2 中， Vue.prototype 通常用于添加所有组件都能访问的 property。
在 Vue 3 等同于config.globalProperties。这些 property 将被复制到应用中作为实例化组件的一部分。
// 之前 - Vue 2
Vue.prototype.$http = () => {}
// 之后 - Vue 3
const app = createApp({})
app.config.globalProperties.$http = () => {}
在Vue2.x中使用 vue-cookies
// 配置cookie
import cookies from 'vue-cookies'
Vue.prototype.$cookies = cookies; //配置时候prototype.$这里的名字自己定义不是固定是cookies
或者
import Vue from 'vue'
import VueCookies from 'vue-cookies'
Vue.use(VueCookies)
使用
// 以秒为单位，设置1天过期
this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX",60 * 60 * 24)
在vue3.x中使用vue-cookies
npm install vue-cookies --save
在main.js中
import VueCookies from 'vue-cookies'
const app = createApp(App)
app.config.globalProperties.$cookies = VueCookies;//全局挂载 同vue2.x Vue.prototype.$cookies
在组件中使用
import { getCurrentInstance } from "vue"
let internalInstance = getCurrentInstance();
let cookies = internalInstance.appContext.config.globalProperties.$cookies;// 访问 globalProperties
cookies.set("token", "7777777788888888", "1M");
使用provide注入全局变量
import VueCookies from 'vue-cookies'
const app = createApp(App)
// app.config.globalProperties.$cookies = VueCookies;
// 第二种方法
app.provide('$cookies', VueCookies);
使用(组合式)：let cookies = inject('$cookies')
使用(选项式)：inject: ["$cookies"]，与methods/computed并列。然后在方法中$cookies.remove("token")
