foo.vue

<template>
  <span>{{ formattedDate }}</span>
</template>

<script>
import { formatDate } from '@core/helpers'
import { mapGetters } from 'vuex'

export default {
  props: {
    date: {
      type: String,
      required: true,
    },
    format: {
      type: String,
      default: null,
    },
  },
  data () {
    return {
      formattedDate: '',
    }
  },
  computed: {
    ...mapGetters({
      locale: 'translations/getLocale',
    }),
  },
  async created () {
    this.formattedDate = await formatDate(this.date, this.locale, this.format)
  },
}
</script>