How to assign value from response to global state value in vuex store

Question

I want to do some fetch request and assign response from that request to some global variable which is accessible from everywhere

dashboard.vue In this template I want to render list, when I click on list item it will redirect me to page with item detail.

<template>
  <div class="main-dashboard-custom">
    <div class="grid-box-custom-container">
      <div
        class="grid-box-custom-item"
        v-for="item in this.$store.state.customJson"
        :key="item.id"
      >
      <router-link :to="`/dashboard/${item.id}`" bexioId="item.bexioId">
           {{ item.title }} 
      </router-link>
    
      </div>
    </div>
  </div>
</template>

<script>
import axios from "@axios";

export default {
  components: {},
  data() {
    return {
      data: {},
    };
  },

  async created() {
     await this.getCustomData(); 
  },
  async mounted() {
  },
  methods: {
     getCustomData() {
      axios
        .get("/data.json")
        .then(
          (res) => (console.log(res), (this.$store.state.customJson = res.data))
        )
        .catch((error) => console.log(error));
    }, 
  },
};
</script>

Params from previous code example working fine, when click on item i am redirected to correct url with id

project.vue this page is empty for now I am just testing if I can access data from vuex and I can't. It looks variable in vuex is empty

<template>
  <div>
    
  </div>
</template>

<script>
import axios from "@axios";

export default {
  components: {},
  data() {
    return {
      data: {},
    };
  },

  created() {

  },
  mounted() {
      console.log("data", this.$store.state.customJson)
  },
  methods: {

  },
};
</script>

this is my index.js is store folder

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
state:{
 customJson:[]
},
 strict: process.env.DEV,
})