https://blog.bg7zag.com/wp-content/uploads/2021/01/vuex.png

// main.ts
import { createApp } from "vue";
import App from "./App.vue";

import store from "./store";

const app = createApp(App);

useAnt(app);
store.forEach(({ modelName, key }) => {
app.use(modelName, key);
});
.mount("#app");


// store/index.ts
import appStore, { key as appKey } from "./modules/app";
// import userStore, { key as userKey } from "./modules/user";
const modules = [
{
modelName: appStore,
key: appKey
},
// {
//  modelName: userStore,
//   key: userKey
// },
];

export default modules;


// store/modules/app.ts
import { InjectionKey } from "vue";
import { createStore, useStore as baseUseStore, Store } from "vuex";

export interface State {
now: number;
}
export const key: InjectionKey<Store<State>> = Symbol();

export default createStore<State>({
state: {
now: Date.now()
},
mutations: {
setNow(state, data: number) {
state.now = data;
}
},
actions: {}
});

export function appStore() {
return baseUseStore(key);
}


参考:

1、TypeScript支持

2、https://github.com/vuejs/vuex/issues/1833#issuecomment-736418224