vue3 怎么创建全局的响应式对象 创建简单的vuex

// main.js
import { createApp, reactive } from 'vue'
const app = createApp(App)
app.config.globalProperties.$language = reactive({ 
    val: storage.get('setting')?.language || 'zh'   // 语言
})

// 组件中修改，页面也会更新，类似store
this.$language.val = 'en'

// vuex 源码，借此就知道怎么创建一个简易store了
store._state = reactive({
   data: state
})

// App.vue
export default {
	created() {
		this.$store.commit('setUser', '法外狂徒张三', 18)
	}
}


// main.js
const app = createApp(App)
app.config.globalProperties.$store = store


// store.js
import { reactive } from 'vue'

export default {
	state: reactive({
		userName: '',
        age: 0
	}),

    mutations: {
        setUser(state, userName, age) {
            state.userName = userName
            state.age = age
            console.log("state::: ", state); 
            // state:::  Proxy {userName: "法外狂徒张三", age: 18}
        }
    },

    commit(eventName, ...data) {
        this.mutations[eventName](this.state, ...data)
    }
}