Vue js. Как передать данные из js дочернего компонента

У меня есть два файла

1: Vue компонент

<template>
<details class="microservices">
    <summary><h1>Дата</h1></summary>
    <div class="manifest">
        <div>
            Установите дату
            <div>{{curentTimer}}</div>
        </div>
    </div>
</details>
</template>
<script>
import obj from './methods/index.js' // подключаемый файл
setInterval(obj[1].getTime(this), 1000)
export default {
  props: ['timer'],
  name: 'date',
  data () {
    return {
    }
  },
  computed: {
    curentTimer () {
      // вычисляемое свойство для таймера
    }
  },
  methods: {
    // set
  }
}
</script>
<style lang="scss" scoped>
    @import '../../../../assets/model/index';
</style>

2: Второй файл подключается к компоненте.

let obj = [{
   getDate () {
   return '[(Init)]'
  }
},
  {
    getTime (state) {
     console.log('method[(index)obj]', state)
     // state.commit('setTimer', '!!!!!!!!!')
   }
}]
export default obj

В 1 файле стоит

setInterval(obj[1].getTime(this), 1000)

Значение обновляется каждую секунду.

Мне надо реактивно обновлять значение в 1 файле(vue component) Как оптимально передать данные из дочернего (2 файла) ?

Это делается с помощью $emit $on

// Генерируем событие, возможно с передаваемыми данными

this.$emit('название' [, данные]);

// Слушаем событие

this.$on('название', function(данные) {...});

Примеры в интернете показывают как это сделать через template.

Я хочу что бы у меня значение обновлялось в свойстве компонента и если мне потребуется выводить его в template.

Как такое правильно записать ? Через mutations значение в vuex обновляется. И по идее this.$store.getters.time в computed:{} должно реактивно изменяться в компоненте но не изменяется.