store state not update by using store code splitting

[cyany]

here is my code:
`
home.vue
async asyncData({ store, route }) {
store.registerModule('homepc', homepcStoreModule)
return store.dispatch("homepc/getHot");
},
mounted(){
this.$refs.changeHot2.addEventListener('click',function(){
_that.getHotLists();
})
}
methods:{
getHotLists(){
return this.$store.dispatch("a/getHot");
},
}

store/index.js
import Vue from "vue";
import Vuex from "vuex";
import moduleHomePc from "./homepc"

Vue.use(Vuex);

export function CreateStore() {
return new Vuex.Store({
modules:{
a:moduleHomePc
}
})
}

store/homepc.js
import Vue from "vue";
import homePc from "./../assets/js/homePc.js";
export default {
namespaced: true,
state: ()=>({
hotLists:[]
}),
mutations: {
getHotLists(state, payload) {
console.log(state,'hot')// !!!but state is empty object like {hotLists:[]}
Vue.set(state, 'hotLists', payload);
}
},
actions: {
getHot({ commit }) {
return homePc.getHotLists({}).then(res => {
if (res.data.code == '0') {
commit('getHotLists', res.data.list);
}
});
},
}
`

I debuged the code console.log(state),open the brower debug mode ,the state is not update.
anynone can give a tip ,thanks in advance!