Writing a project needs to accept push data from the background and display it
so communicate with socket.io.client
now the problem is to modify the state by using store"s dispatch or commit method in the socket.io callback. You can see that the printed state value has been changed, but the vue component"s view layer does not refresh the new value call $store.getters.userCounts is always 0
ask why this is

main.js

import Vue from "vue"
import axios from "axios"

import App from "./App"
import router from "./router"
import store from "./store"

import io from "socket.io-client"
const domain = "127.0.0.1"
const port = "3000"

const socket = io("http://" + domain + ":" + port)

if (!process.env.IS_WEB) Vue.use(require("vue-electron"))
Vue.http = Vue.prototype.$http = axios
Vue.config.productionTip = false
Vue.use(socket, store)

/* eslint-disable no-new */
new Vue({
  components: { App },
  router,
  store,
  template: "<App/>",
  created () {
    this.startClinet()
  },
  methods: {
    startClinet () {      
      // 
      socket.on("connect", () => {
        this.$store.dispatch("updateDatasAction", 6666)
        // socket.emit("login", uid)
      })

      // 
      socket.on("refresh", function (response) {
        // store.dispatch("updateDatasAction", response)
      })
    }
  }
}).$mount("-sharpapp")

store.js

import Vue from "vue"
import Vuex from "vuex"

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    todayUsers: 0
  },
  getters: {
    userCounts: state => {
      return state.todayUsers
    }
  },
  mutations: {
    UPDATA_DATAS (state, datas) {
      state.todayUsers = datas
    }
  },
  actions: {
    updateDatasAction (context, datas) {
      context.commit("UPDATA_DATAS", datas)
    }
  }
})