How to use mutation in .ts file Vue JS?

Below is my code , There is async function which executes even before the is loaded

i want it to get executed after the dom is loaded , is there any way i can do this in this .ts file

Currently once page gets loaded i get the of rootState.user.current.id but , on async function it gets null value.

Here is the file code -

import Vue from 'vue'
import { ActionTree } from 'vuex'
import * as types from './mutation-types'
import i18n from '@vue-storefront/i18n'
import { htmlDecode } from '@vue-storefront/core/store/lib/filters'
import rootStore from '@vue-storefront/core/store'
import RootState from '@vue-storefront/core/types/RootState'
import WishlistState from '../types/WishlistState'
import { cacheStorage } from '../'
import { Logger } from '@vue-storefront/core/lib/logger'
import { TaskQueue } from '@vue-storefront/core/lib/sync'
import config from 'config'
import Task from '@vue-storefront/core/lib/sync/types/Task'

async function _serverLoad (customer_id: number) {
  const url = config.wishlist.pull_endpoint.replace('{{customer_id}}', customer_id)
  return TaskQueue.execute({
    url,
    payload: {
      method: 'GET',
      headers: { 'Content-Type': 'application/json' },
      mode: 'cors'
    },
    silent: true
  })
    .then(async (task: Task) => {
      if (task.resultCode === 200) {
        // diffLog = await dispatch('merge', { serverItems: task.result, clientItems: getters.getCartItems, dryRun: dryRun, forceClientState: forceClientState })
        return task.result.map(x => x._source)
      } else {
        throw new Error('error retrieving wishlist')
      }
    })
}
async function _serverAddItem (customer_id: number, product_id: number) {
  const url = config.wishlist.additem_endpoint.replace('{{customer_id}}', customer_id).replace('{{product_id}}', product_id)
  return TaskQueue.execute({
    url,
    payload: {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      mode: 'cors'
    },
    silent: true
  })
    .then(async (task: Task) => {
      if (task.resultCode === 200) {
        // diffLog = await dispatch('merge', { serverItems: task.result, clientItems: getters.getCartItems, dryRun: dryRun, forceClientState: forceClientState })
        return true
      } else {
        throw new Error('error adding item wishlist')
      }
    })
}
async function _serverDeleteItem (customer_id: number, product_id: number) {
  const url = config.wishlist.deleteitem_endpoint.replace('{{customer_id}}', customer_id).replace('{{product_id}}', product_id)
  return TaskQueue.execute({
    url,
    payload: {
      method: 'DELETE',
      headers: { 'Content-Type': 'application/json' },
      mode: 'cors'
    },
    silent: true
  })
    .then(async (task: Task) => {
      if (task.resultCode === 200) {
        // diffLog = await dispatch('merge', { serverItems: task.result, clientItems: getters.getCartItems, dryRun: dryRun, forceClientState: forceClientState })
        return true
      } else {
        throw new Error('error deleting item wishlist')
      }
    })
}
const actions: ActionTree<WishlistState, RootState> = {
  clear (context) {
    context.commit(types.WISH_LOAD_WISH, [])
  },
  async load ({ commit, getters, rootState, rootGetters }, force: boolean = false) {
    if (!force && getters.isWishlistLoaded) return
    commit(types.SET_WISHLIST_LOADED)
    cacheStorage.getItem('current-wishlist', (err, storedItems) => {
      if (err) throw new Error(err)
      commit(types.WISH_LOAD_WISH, storedItems)
      Logger.info('Wishlist state loaded from browser cache. ', 'cache', storedItems)()
    })
    if (rootGetters['user/isLoggedIn']) {
      const storedItems = await _serverLoad(rootState.user.current.id)
      commit(types.WISH_LOAD_WISH, storedItems)
      Logger.info('Wishlist state loaded from server. ', 'server', storedItems)()
    }
  },
  async addItem ({ commit, rootGetters, rootState }, product) {
    commit(types.WISH_ADD_ITEM, { product })
    rootStore.dispatch('notification/spawnNotification', {
      type: 'success',
      message: i18n.t('Product {productName} has been added to wishlist!', { productName: htmlDecode(product.name) }),
      action1: { label: i18n.t('OK') }
    })
    if (rootGetters['user/isLoggedIn']) {
      await _serverAddItem(rootState.user.current.id, product.id)
      Logger.info('Wishlist product added to server. ', 'server', product)()
    }
  },
  async removeItem ({ commit, rootGetters, rootState }, product) {
    commit(types.WISH_DEL_ITEM, { product })
    rootStore.dispatch('notification/spawnNotification', {
      type: 'success',
      message: i18n.t('Product {productName} has been removed from wishlit!', { productName: htmlDecode(product.name) }),
      action1: { label: i18n.t('OK') }
    })
    if (rootGetters['user/isLoggedIn']) {
      await _serverDeleteItem(rootState.user.current.id, product.id)
      Logger.info('Wishlist product deleted from server. ', 'server', product)()
    }
  }
}
export default actions

Feel free to share your thoughts on this , Thanks